.select2-container{box-sizing:border-box;display:inline-block;margin:0;position:relative;vertical-align:middle}.select2-container .select2-selection--single{box-sizing:border-box;cursor:pointer;display:block;height:28px;user-select:none;-webkit-user-select:none}.select2-container .select2-selection--single .select2-selection__rendered{display:block;padding-left:8px;padding-right:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select2-container .select2-selection--single .select2-selection__clear{background-color:rgba(0,0,0,0);border:none;font-size:1em}.select2-container[dir=rtl] .select2-selection--single .select2-selection__rendered{padding-right:8px;padding-left:20px}.select2-container .select2-selection--multiple{box-sizing:border-box;cursor:pointer;display:block;min-height:32px;user-select:none;-webkit-user-select:none}.select2-container .select2-selection--multiple .select2-selection__rendered{display:inline;list-style:none;padding:0}.select2-container .select2-selection--multiple .select2-selection__clear{background-color:rgba(0,0,0,0);border:none;font-size:1em}.select2-container .select2-search--inline .select2-search__field{box-sizing:border-box;border:none;font-size:100%;margin-top:5px;margin-left:5px;padding:0;max-width:100%;resize:none;height:20px;vertical-align:bottom;font-family:sans-serif;overflow:hidden;word-break:keep-all}.select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button{-webkit-appearance:none}.select2-container .select2-search--inline .select2-search__field::placeholder{line-height:normal}.select2-dropdown{background-color:#fff;border:1px solid #aaa;border-radius:4px;box-sizing:border-box;display:block;position:absolute;left:-100000px;width:100%;z-index:1051}.select2-results{display:block}.select2-results__options{list-style:none;margin:0;padding:0}.select2-results__option{padding:6px;user-select:none;-webkit-user-select:none}.select2-results__option--selectable{cursor:pointer}.select2-container--open .select2-dropdown{left:0}.select2-container--open .select2-dropdown--above{border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0}.select2-container--open .select2-dropdown--below{border-top:none;border-top-left-radius:0;border-top-right-radius:0}.select2-search--dropdown{display:block;padding:4px}.select2-search--dropdown .select2-search__field{padding:4px;width:100%;box-sizing:border-box}.select2-search--dropdown .select2-search__field::-webkit-search-cancel-button{-webkit-appearance:none}.select2-search--dropdown.select2-search--hide{display:none}.select2-close-mask{border:0;margin:0;padding:0;display:block;position:fixed;left:0;top:0;min-height:100%;min-width:100%;height:auto;width:auto;opacity:0;z-index:99;background-color:#fff;filter:alpha(opacity=0)}.select2-hidden-accessible{border:0 !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;height:1px !important;overflow:hidden !important;padding:0 !important;position:absolute !important;width:1px !important;white-space:nowrap !important}.select2-container--default .select2-selection--single{background-color:#fff;border:1px solid #aaa;border-radius:4px}.select2-container--default .select2-selection--single .select2-selection__rendered{color:#444;line-height:28px}.select2-container--default .select2-selection--single .select2-selection__clear{cursor:pointer;float:right;font-weight:bold;height:26px;margin-right:20px;padding-right:0px}.select2-container--default .select2-selection--single .select2-selection__placeholder{color:#999}.select2-container--default .select2-selection--single .select2-selection__arrow{height:26px;position:absolute;top:1px;right:1px;width:20px}.select2-container--default .select2-selection--single .select2-selection__arrow b{border-color:#888 rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);border-style:solid;border-width:5px 4px 0 4px;height:0;left:50%;margin-left:-4px;margin-top:-2px;position:absolute;top:50%;width:0}.select2-container--default[dir=rtl] .select2-selection--single .select2-selection__clear{float:left}.select2-container--default[dir=rtl] .select2-selection--single .select2-selection__arrow{left:1px;right:auto}.select2-container--default.select2-container--disabled .select2-selection--single{background-color:#eee;cursor:default}.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear{display:none}.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b{border-color:rgba(0,0,0,0) rgba(0,0,0,0) #888 rgba(0,0,0,0);border-width:0 4px 5px 4px}.select2-container--default .select2-selection--multiple{background-color:#fff;border:1px solid #aaa;border-radius:4px;cursor:text;padding-bottom:5px;padding-right:5px;position:relative}.select2-container--default .select2-selection--multiple.select2-selection--clearable{padding-right:25px}.select2-container--default .select2-selection--multiple .select2-selection__clear{cursor:pointer;font-weight:bold;height:20px;margin-right:10px;margin-top:5px;position:absolute;right:0;padding:1px}.select2-container--default .select2-selection--multiple .select2-selection__choice{background-color:#e4e4e4;border:1px solid #aaa;border-radius:4px;box-sizing:border-box;display:inline-block;margin-left:5px;margin-top:5px;padding:0;padding-left:20px;position:relative;max-width:100%;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom;white-space:nowrap}.select2-container--default .select2-selection--multiple .select2-selection__choice__display{cursor:default;padding-left:2px;padding-right:5px}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{background-color:rgba(0,0,0,0);border:none;border-right:1px solid #aaa;border-top-left-radius:4px;border-bottom-left-radius:4px;color:#999;cursor:pointer;font-size:1em;font-weight:bold;padding:0 4px;position:absolute;left:0;top:0}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover,.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:focus{background-color:#f1f1f1;color:#333;outline:none}.select2-container--default[dir=rtl] .select2-selection--multiple .select2-selection__choice{padding:0 20px 0 0;margin-left:5px;margin-right:auto}.select2-container--default[dir=rtl] .select2-selection--multiple .select2-selection__choice__display{padding-left:5px;padding-right:2px}.select2-container--default[dir=rtl] .select2-selection--multiple .select2-selection__choice__remove{left:auto;right:0;border-left:1px solid #aaa;border-right:none;border-top-left-radius:0;border-bottom-left-radius:0;border-top-right-radius:4px;border-bottom-right-radius:4px}.select2-container--default[dir=rtl] .select2-selection--multiple .select2-selection__clear{float:left;margin-left:10px;margin-right:auto}.select2-container--default.select2-container--focus .select2-selection--multiple{border:solid #000 1px;outline:0}.select2-container--default.select2-container--disabled .select2-selection--multiple{background-color:#eee;cursor:default}.select2-container--default.select2-container--disabled .select2-selection__choice__remove{display:none}.select2-container--default.select2-container--open.select2-container--above .select2-selection--single,.select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple{border-top-left-radius:0;border-top-right-radius:0}.select2-container--default.select2-container--open.select2-container--below .select2-selection--single,.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple{border-bottom-left-radius:0;border-bottom-right-radius:0}.select2-container--default .select2-search--dropdown .select2-search__field{border:1px solid #aaa}.select2-container--default .select2-search--inline .select2-search__field{background:rgba(0,0,0,0);border:none;outline:0;box-shadow:none;-webkit-appearance:textfield}.select2-container--default .select2-results>.select2-results__options{max-height:200px;overflow-y:auto}.select2-container--default .select2-results__option .select2-results__option{padding-left:1em}.select2-container--default .select2-results__option .select2-results__option .select2-results__group{padding-left:0}.select2-container--default .select2-results__option .select2-results__option .select2-results__option{margin-left:-1em;padding-left:2em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-2em;padding-left:3em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-3em;padding-left:4em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-4em;padding-left:5em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-5em;padding-left:6em}.select2-container--default .select2-results__option--group{padding:0}.select2-container--default .select2-results__option--disabled{color:#999}.select2-container--default .select2-results__option--selected{background-color:#ddd}.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable{background-color:#5897fb;color:#fff}.select2-container--default .select2-results__group{cursor:default;display:block;padding:6px}.select2-container--classic .select2-selection--single{background-color:rgb(246.5,246.5,246.5);border:1px solid #aaa;border-radius:4px;outline:0;background-image:-webkit-linear-gradient(top, white 50%, #eeeeee 100%);background-image:-o-linear-gradient(top, white 50%, #eeeeee 100%);background-image:linear-gradient(to bottom, white 50%, #eeeeee 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0)}.select2-container--classic .select2-selection--single:focus{border:1px solid #5897fb}.select2-container--classic .select2-selection--single .select2-selection__rendered{color:#444;line-height:28px}.select2-container--classic .select2-selection--single .select2-selection__clear{cursor:pointer;float:right;font-weight:bold;height:26px;margin-right:20px}.select2-container--classic .select2-selection--single .select2-selection__placeholder{color:#999}.select2-container--classic .select2-selection--single .select2-selection__arrow{background-color:#ddd;border:none;border-left:1px solid #aaa;border-top-right-radius:4px;border-bottom-right-radius:4px;height:26px;position:absolute;top:1px;right:1px;width:20px;background-image:-webkit-linear-gradient(top, #eeeeee 50%, #cccccc 100%);background-image:-o-linear-gradient(top, #eeeeee 50%, #cccccc 100%);background-image:linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0)}.select2-container--classic .select2-selection--single .select2-selection__arrow b{border-color:#888 rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);border-style:solid;border-width:5px 4px 0 4px;height:0;left:50%;margin-left:-4px;margin-top:-2px;position:absolute;top:50%;width:0}.select2-container--classic[dir=rtl] .select2-selection--single .select2-selection__clear{float:left}.select2-container--classic[dir=rtl] .select2-selection--single .select2-selection__arrow{border:none;border-right:1px solid #aaa;border-radius:0;border-top-left-radius:4px;border-bottom-left-radius:4px;left:1px;right:auto}.select2-container--classic.select2-container--open .select2-selection--single{border:1px solid #5897fb}.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow{background:rgba(0,0,0,0);border:none}.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b{border-color:rgba(0,0,0,0) rgba(0,0,0,0) #888 rgba(0,0,0,0);border-width:0 4px 5px 4px}.select2-container--classic.select2-container--open.select2-container--above .select2-selection--single{border-top:none;border-top-left-radius:0;border-top-right-radius:0;background-image:-webkit-linear-gradient(top, white 0%, #eeeeee 50%);background-image:-o-linear-gradient(top, white 0%, #eeeeee 50%);background-image:linear-gradient(to bottom, white 0%, #eeeeee 50%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0)}.select2-container--classic.select2-container--open.select2-container--below .select2-selection--single{border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0;background-image:-webkit-linear-gradient(top, #eeeeee 50%, white 100%);background-image:-o-linear-gradient(top, #eeeeee 50%, white 100%);background-image:linear-gradient(to bottom, #eeeeee 50%, white 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0)}.select2-container--classic .select2-selection--multiple{background-color:#fff;border:1px solid #aaa;border-radius:4px;cursor:text;outline:0;padding-bottom:5px;padding-right:5px}.select2-container--classic .select2-selection--multiple:focus{border:1px solid #5897fb}.select2-container--classic .select2-selection--multiple .select2-selection__clear{display:none}.select2-container--classic .select2-selection--multiple .select2-selection__choice{background-color:#e4e4e4;border:1px solid #aaa;border-radius:4px;display:inline-block;margin-left:5px;margin-top:5px;padding:0}.select2-container--classic .select2-selection--multiple .select2-selection__choice__display{cursor:default;padding-left:2px;padding-right:5px}.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove{background-color:rgba(0,0,0,0);border:none;border-top-left-radius:4px;border-bottom-left-radius:4px;color:#888;cursor:pointer;font-size:1em;font-weight:bold;padding:0 4px}.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover{color:#555;outline:none}.select2-container--classic[dir=rtl] .select2-selection--multiple .select2-selection__choice{margin-left:5px;margin-right:auto}.select2-container--classic[dir=rtl] .select2-selection--multiple .select2-selection__choice__display{padding-left:5px;padding-right:2px}.select2-container--classic[dir=rtl] .select2-selection--multiple .select2-selection__choice__remove{border-top-left-radius:0;border-bottom-left-radius:0;border-top-right-radius:4px;border-bottom-right-radius:4px}.select2-container--classic.select2-container--open .select2-selection--multiple{border:1px solid #5897fb}.select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple{border-top:none;border-top-left-radius:0;border-top-right-radius:0}.select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple{border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0}.select2-container--classic .select2-search--dropdown .select2-search__field{border:1px solid #aaa;outline:0}.select2-container--classic .select2-search--inline .select2-search__field{outline:0;box-shadow:none}.select2-container--classic .select2-dropdown{background-color:#fff;border:1px solid rgba(0,0,0,0)}.select2-container--classic .select2-dropdown--above{border-bottom:none}.select2-container--classic .select2-dropdown--below{border-top:none}.select2-container--classic .select2-results>.select2-results__options{max-height:200px;overflow-y:auto}.select2-container--classic .select2-results__option--group{padding:0}.select2-container--classic .select2-results__option--disabled{color:gray}.select2-container--classic .select2-results__option--highlighted.select2-results__option--selectable{background-color:#3875d7;color:#fff}.select2-container--classic .select2-results__group{cursor:default;display:block;padding:6px}.select2-container--classic.select2-container--open .select2-dropdown{border-color:#5897fb}

trix-editor {
  border: 1px solid #bbb;
  border-radius: 3px;
  margin: 0;
  padding: 0.4em 0.6em;
  min-height: 5em;
  outline: none;
}

trix-toolbar * {
  box-sizing: border-box;
}
trix-toolbar .trix-button-row {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  overflow-x: auto;
}
trix-toolbar .trix-button-group {
  display: flex;
  margin-bottom: 10px;
  border: 1px solid #bbb;
  border-top-color: #ccc;
  border-bottom-color: #888;
  border-radius: 3px;
}
trix-toolbar .trix-button-group:not(:first-child) {
  margin-left: 1.5vw;
}
@media (max-width: 768px) {
  trix-toolbar .trix-button-group:not(:first-child) {
    margin-left: 0;
  }
}
trix-toolbar .trix-button-group-spacer {
  flex-grow: 1;
}
@media (max-width: 768px) {
  trix-toolbar .trix-button-group-spacer {
    display: none;
  }
}
trix-toolbar .trix-button {
  position: relative;
  float: left;
  color: rgba(0, 0, 0, 0.6);
  font-size: 0.75em;
  font-weight: 600;
  white-space: nowrap;
  padding: 0 0.5em;
  margin: 0;
  outline: none;
  border: none;
  border-bottom: 1px solid #ddd;
  border-radius: 0;
  background: transparent;
}
trix-toolbar .trix-button:not(:first-child) {
  border-left: 1px solid #ccc;
}
trix-toolbar .trix-button.trix-active {
  background: #cbeefa;
  color: rgb(0, 0, 0);
}
trix-toolbar .trix-button:not(:disabled) {
  cursor: pointer;
}
trix-toolbar .trix-button:disabled {
  color: rgba(0, 0, 0, 0.125);
}
@media (max-width: 768px) {
  trix-toolbar .trix-button {
    letter-spacing: -0.01em;
    padding: 0 0.3em;
  }
}
trix-toolbar .trix-button--icon {
  font-size: inherit;
  width: 2.6em;
  height: 1.6em;
  max-width: calc(0.8em + 4vw);
  text-indent: -9999px;
}
@media (max-width: 768px) {
  trix-toolbar .trix-button--icon {
    height: 2em;
    max-width: calc(0.8em + 3.5vw);
  }
}
trix-toolbar .trix-button--icon::before {
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0.6;
  content: "";
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
@media (max-width: 768px) {
  trix-toolbar .trix-button--icon::before {
    right: 6%;
    left: 6%;
  }
}
trix-toolbar .trix-button--icon.trix-active::before {
  opacity: 1;
}
trix-toolbar .trix-button--icon:disabled::before {
  opacity: 0.125;
}
trix-toolbar .trix-button--icon-attach::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M10.5%2018V7.5c0-2.25%203-2.25%203%200V18c0%204.125-6%204.125-6%200V7.5c0-6.375%209-6.375%209%200V18%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-miterlimit%3D%2210%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");
  top: 8%;
  bottom: 4%;
}
trix-toolbar .trix-button--icon-bold::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M6.522%2019.242a.5.5%200%200%201-.5-.5V5.35a.5.5%200%200%201%20.5-.5h5.783c1.347%200%202.46.345%203.24.982.783.64%201.216%201.562%201.216%202.683%200%201.13-.587%202.129-1.476%202.71a.35.35%200%200%200%20.049.613c1.259.56%202.101%201.742%202.101%203.22%200%201.282-.483%202.334-1.363%203.063-.876.726-2.132%201.12-3.66%201.12h-5.89ZM9.27%207.347v3.362h1.97c.766%200%201.347-.17%201.733-.464.38-.291.587-.716.587-1.27%200-.53-.183-.928-.513-1.198-.334-.273-.838-.43-1.505-.43H9.27Zm0%205.606v3.791h2.389c.832%200%201.448-.177%201.853-.497.399-.315.614-.786.614-1.423%200-.62-.22-1.077-.63-1.385-.418-.313-1.053-.486-1.905-.486H9.27Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-italic::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M9%205h6.5v2h-2.23l-2.31%2010H13v2H6v-2h2.461l2.306-10H9V5Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-link::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M18.948%205.258a4.337%204.337%200%200%200-6.108%200L11.217%206.87a.993.993%200%200%200%200%201.41c.392.39%201.027.39%201.418%200l1.623-1.613a2.323%202.323%200%200%201%203.271%200%202.29%202.29%200%200%201%200%203.251l-2.393%202.38a3.021%203.021%200%200%201-4.255%200l-.05-.049a1.007%201.007%200%200%200-1.418%200%20.993.993%200%200%200%200%201.41l.05.049a5.036%205.036%200%200%200%207.091%200l2.394-2.38a4.275%204.275%200%200%200%200-6.072Zm-13.683%2013.6a4.337%204.337%200%200%200%206.108%200l1.262-1.255a.993.993%200%200%200%200-1.41%201.007%201.007%200%200%200-1.418%200L9.954%2017.45a2.323%202.323%200%200%201-3.27%200%202.29%202.29%200%200%201%200-3.251l2.344-2.331a2.579%202.579%200%200%201%203.631%200c.392.39%201.027.39%201.419%200a.993.993%200%200%200%200-1.41%204.593%204.593%200%200%200-6.468%200l-2.345%202.33a4.275%204.275%200%200%200%200%206.072Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-strike::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M6%2014.986c.088%202.647%202.246%204.258%205.635%204.258%203.496%200%205.713-1.728%205.713-4.463%200-.275-.02-.536-.062-.781h-3.461c.398.293.573.654.573%201.123%200%201.035-1.074%201.787-2.646%201.787-1.563%200-2.773-.762-2.91-1.924H6ZM6.432%2010h3.763c-.632-.314-.914-.715-.914-1.273%200-1.045.977-1.739%202.432-1.739%201.475%200%202.52.723%202.617%201.914h2.764c-.05-2.548-2.11-4.238-5.39-4.238-3.145%200-5.392%201.719-5.392%204.316%200%20.363.04.703.12%201.02ZM4%2011a1%201%200%201%200%200%202h15a1%201%200%201%200%200-2H4Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-quote::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M4.581%208.471c.44-.5%201.056-.834%201.758-.995C8.074%207.17%209.201%207.822%2010%208.752c1.354%201.578%201.33%203.555.394%205.277-.941%201.731-2.788%203.163-4.988%203.56a.622.622%200%200%201-.653-.317c-.113-.205-.121-.49.16-.764.294-.286.567-.566.791-.835.222-.266.413-.54.524-.815.113-.28.156-.597.026-.908-.128-.303-.39-.524-.72-.69a3.02%203.02%200%200%201-1.674-2.7c0-.905.283-1.59.72-2.088Zm9.419%200c.44-.5%201.055-.834%201.758-.995%201.734-.306%202.862.346%203.66%201.276%201.355%201.578%201.33%203.555.395%205.277-.941%201.731-2.789%203.163-4.988%203.56a.622.622%200%200%201-.653-.317c-.113-.205-.122-.49.16-.764.294-.286.567-.566.791-.835.222-.266.412-.54.523-.815.114-.28.157-.597.026-.908-.127-.303-.39-.524-.72-.69a3.02%203.02%200%200%201-1.672-2.701c0-.905.283-1.59.72-2.088Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-heading-1::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21.5%207.5v-3h-12v3H14v13h3v-13h4.5ZM9%2013.5h3.5v-3h-10v3H6v7h3v-7Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-code::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M3.293%2011.293a1%201%200%200%200%200%201.414l4%204a1%201%200%201%200%201.414-1.414L5.414%2012l3.293-3.293a1%201%200%200%200-1.414-1.414l-4%204Zm13.414%205.414%204-4a1%201%200%200%200%200-1.414l-4-4a1%201%200%201%200-1.414%201.414L18.586%2012l-3.293%203.293a1%201%200%200%200%201.414%201.414Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-bullet-list::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%207.5a1.5%201.5%200%201%200%200-3%201.5%201.5%200%200%200%200%203ZM8%206a1%201%200%200%201%201-1h11a1%201%200%201%201%200%202H9a1%201%200%200%201-1-1Zm1%205a1%201%200%201%200%200%202h11a1%201%200%201%200%200-2H9Zm0%206a1%201%200%201%200%200%202h11a1%201%200%201%200%200-2H9Zm-2.5-5a1.5%201.5%200%201%201-3%200%201.5%201.5%200%200%201%203%200ZM5%2019.5a1.5%201.5%200%201%200%200-3%201.5%201.5%200%200%200%200%203Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-number-list::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M3%204h2v4H4V5H3V4Zm5%202a1%201%200%200%201%201-1h11a1%201%200%201%201%200%202H9a1%201%200%200%201-1-1Zm1%205a1%201%200%201%200%200%202h11a1%201%200%201%200%200-2H9Zm0%206a1%201%200%201%200%200%202h11a1%201%200%201%200%200-2H9Zm-3.5-7H6v1l-1.5%202H6v1H3v-1l1.667-2H3v-1h2.5ZM3%2017v-1h3v4H3v-1h2v-.5H4v-1h1V17H3Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-undo::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M3%2014a1%201%200%200%200%201%201h6a1%201%200%201%200%200-2H6.257c2.247-2.764%205.151-3.668%207.579-3.264%202.589.432%204.739%202.356%205.174%205.405a1%201%200%200%200%201.98-.283c-.564-3.95-3.415-6.526-6.825-7.095C11.084%207.25%207.63%208.377%205%2011.39V8a1%201%200%200%200-2%200v6Zm2-1Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-redo::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2014a1%201%200%200%201-1%201h-6a1%201%200%201%201%200-2h3.743c-2.247-2.764-5.151-3.668-7.579-3.264-2.589.432-4.739%202.356-5.174%205.405a1%201%200%200%201-1.98-.283c.564-3.95%203.415-6.526%206.826-7.095%203.08-.513%206.534.614%209.164%203.626V8a1%201%200%201%201%202%200v6Zm-2-1Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-decrease-nesting-level::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%206a1%201%200%200%201%201-1h12a1%201%200%201%201%200%202H6a1%201%200%200%201-1-1Zm4%205a1%201%200%201%200%200%202h9a1%201%200%201%200%200-2H9Zm-3%206a1%201%200%201%200%200%202h12a1%201%200%201%200%200-2H6Zm-3.707-5.707a1%201%200%200%200%200%201.414l2%202a1%201%200%201%200%201.414-1.414L4.414%2012l1.293-1.293a1%201%200%200%200-1.414-1.414l-2%202Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-button--icon-increase-nesting-level::before {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%206a1%201%200%200%201%201-1h12a1%201%200%201%201%200%202H6a1%201%200%200%201-1-1Zm4%205a1%201%200%201%200%200%202h9a1%201%200%201%200%200-2H9Zm-3%206a1%201%200%201%200%200%202h12a1%201%200%201%200%200-2H6Zm-2.293-2.293%202-2a1%201%200%200%200%200-1.414l-2-2a1%201%200%201%200-1.414%201.414L3.586%2012l-1.293%201.293a1%201%200%201%200%201.414%201.414Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
}
trix-toolbar .trix-dialogs {
  position: relative;
}
trix-toolbar .trix-dialog {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  font-size: 0.75em;
  padding: 15px 10px;
  background: #fff;
  box-shadow: 0 0.3em 1em #ccc;
  border-top: 2px solid #888;
  border-radius: 5px;
  z-index: 5;
}
trix-toolbar .trix-input--dialog {
  font-size: inherit;
  font-weight: normal;
  padding: 0.5em 0.8em;
  margin: 0 10px 0 0;
  border-radius: 3px;
  border: 1px solid #bbb;
  background-color: #fff;
  box-shadow: none;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}
trix-toolbar .trix-input--dialog.validate:invalid {
  box-shadow: #F00 0px 0px 1.5px 1px;
}
trix-toolbar .trix-button--dialog {
  font-size: inherit;
  padding: 0.5em;
  border-bottom: none;
}
trix-toolbar .trix-dialog--link {
  max-width: 600px;
}
trix-toolbar .trix-dialog__link-fields {
  display: flex;
  align-items: baseline;
}
trix-toolbar .trix-dialog__link-fields .trix-input {
  flex: 1;
}
trix-toolbar .trix-dialog__link-fields .trix-button-group {
  flex: 0 0 content;
  margin: 0;
}

trix-editor [data-trix-mutable]:not(.attachment__caption-editor) {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

trix-editor [data-trix-mutable] ::-moz-selection, trix-editor [data-trix-mutable]::-moz-selection,
trix-editor [data-trix-cursor-target]::-moz-selection {
  background: none;
}
trix-editor [data-trix-mutable] ::selection, trix-editor [data-trix-mutable]::selection,
trix-editor [data-trix-cursor-target]::selection {
  background: none;
}

trix-editor [data-trix-mutable].attachment__caption-editor:focus::-moz-selection {
  background: highlight;
}
trix-editor [data-trix-mutable].attachment__caption-editor:focus::selection {
  background: highlight;
}

trix-editor [data-trix-mutable].attachment.attachment--file {
  box-shadow: 0 0 0 2px highlight;
  border-color: transparent;
}
trix-editor [data-trix-mutable].attachment img {
  box-shadow: 0 0 0 2px highlight;
}
trix-editor .attachment {
  position: relative;
}
trix-editor .attachment:hover {
  cursor: default;
}
trix-editor .attachment--preview .attachment__caption:hover {
  cursor: text;
}
trix-editor .attachment__progress {
  position: absolute;
  z-index: 1;
  height: 20px;
  top: calc(50% - 10px);
  left: 5%;
  width: 90%;
  opacity: 0.9;
  transition: opacity 200ms ease-in;
}
trix-editor .attachment__progress[value="100"] {
  opacity: 0;
}
trix-editor .attachment__caption-editor {
  display: inline-block;
  width: 100%;
  margin: 0;
  padding: 0;
  font-size: inherit;
  font-family: inherit;
  line-height: inherit;
  color: inherit;
  text-align: center;
  vertical-align: top;
  border: none;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}
trix-editor .attachment__toolbar {
  position: absolute;
  z-index: 1;
  top: -0.9em;
  left: 0;
  width: 100%;
  text-align: center;
}
trix-editor .trix-button-group {
  display: inline-flex;
}
trix-editor .trix-button {
  position: relative;
  float: left;
  color: #666;
  white-space: nowrap;
  font-size: 80%;
  padding: 0 0.8em;
  margin: 0;
  outline: none;
  border: none;
  border-radius: 0;
  background: transparent;
}
trix-editor .trix-button:not(:first-child) {
  border-left: 1px solid #ccc;
}
trix-editor .trix-button.trix-active {
  background: #cbeefa;
}
trix-editor .trix-button:not(:disabled) {
  cursor: pointer;
}
trix-editor .trix-button--remove {
  text-indent: -9999px;
  display: inline-block;
  padding: 0;
  outline: none;
  width: 1.8em;
  height: 1.8em;
  line-height: 1.8em;
  border-radius: 50%;
  background-color: #fff;
  border: 2px solid highlight;
  box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.25);
}
trix-editor .trix-button--remove::before {
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0.7;
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg%20height%3D%2224%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M19%206.41%2017.59%205%2012%2010.59%206.41%205%205%206.41%2010.59%2012%205%2017.59%206.41%2019%2012%2013.41%2017.59%2019%2019%2017.59%2013.41%2012z%22%2F%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3C%2Fsvg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 90%;
}
trix-editor .trix-button--remove:hover {
  border-color: #333;
}
trix-editor .trix-button--remove:hover::before {
  opacity: 1;
}
trix-editor .attachment__metadata-container {
  position: relative;
}
trix-editor .attachment__metadata {
  position: absolute;
  left: 50%;
  top: 2em;
  transform: translate(-50%, 0);
  max-width: 90%;
  padding: 0.1em 0.6em;
  font-size: 0.8em;
  color: #fff;
  background-color: rgba(0, 0, 0, 0.7);
  border-radius: 3px;
}
trix-editor .attachment__metadata .attachment__name {
  display: inline-block;
  max-width: 100%;
  vertical-align: bottom;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
trix-editor .attachment__metadata .attachment__size {
  margin-left: 0.2em;
  white-space: nowrap;
}

.trix-content {
  line-height: 1.5;
  overflow-wrap: break-word;
  word-break: break-word;
}
.trix-content * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
.trix-content h1 {
  font-size: 1.2em;
  line-height: 1.2;
}
.trix-content blockquote {
  border: 0 solid #ccc;
  border-left-width: 0.3em;
  margin-left: 0.3em;
  padding-left: 0.6em;
}
.trix-content [dir=rtl] blockquote,
.trix-content blockquote[dir=rtl] {
  border-width: 0;
  border-right-width: 0.3em;
  margin-right: 0.3em;
  padding-right: 0.6em;
}
.trix-content li {
  margin-left: 1em;
}
.trix-content [dir=rtl] li {
  margin-right: 1em;
}
.trix-content pre {
  display: inline-block;
  width: 100%;
  vertical-align: top;
  font-family: monospace;
  font-size: 0.9em;
  padding: 0.5em;
  white-space: pre;
  background-color: #eee;
  overflow-x: auto;
}
.trix-content img {
  max-width: 100%;
  height: auto;
}
.trix-content .attachment {
  display: inline-block;
  position: relative;
  max-width: 100%;
}
.trix-content .attachment a {
  color: inherit;
  text-decoration: none;
}
.trix-content .attachment a:hover, .trix-content .attachment a:visited:hover {
  color: inherit;
}
.trix-content .attachment__caption {
  text-align: center;
}
.trix-content .attachment__caption .attachment__name + .attachment__size::before {
  content: " •";
}
.trix-content .attachment--preview {
  width: 100%;
  text-align: center;
}
.trix-content .attachment--preview .attachment__caption {
  color: #666;
  font-size: 0.9em;
  line-height: 1.2;
}
.trix-content .attachment--file {
  color: #333;
  line-height: 1;
  margin: 0 2px 2px 2px;
  padding: 0.4em 1em;
  border: 1px solid #bbb;
  border-radius: 5px;
}
.trix-content .attachment-gallery {
  display: flex;
  flex-wrap: wrap;
  position: relative;
}
.trix-content .attachment-gallery .attachment {
  flex: 1 0 33%;
  padding: 0 0.5em;
  max-width: 33%;
}
.trix-content .attachment-gallery.attachment-gallery--2 .attachment, .trix-content .attachment-gallery.attachment-gallery--4 .attachment {
  flex-basis: 50%;
  max-width: 50%;
}
/*
 * Provides a drop-in pointer for the default Trix stylesheet that will format the toolbar and
 * the trix-editor content (whether displayed or under editing). Feel free to incorporate this
 * inclusion directly in any other asset bundle and remove this file.
 *

*/

/*
 * We need to override trix.css’s image gallery styles to accommodate the
 * <action-text-attachment> element we wrap around attachments. Otherwise,
 * images in galleries will be squished by the max-width: 33%; rule.
*/
.trix-content .attachment-gallery > action-text-attachment,
.trix-content .attachment-gallery > .attachment {
  flex: 1 0 33%;
  padding: 0 0.5em;
  max-width: 33%;
}

.trix-content .attachment-gallery.attachment-gallery--2 > action-text-attachment,
.trix-content .attachment-gallery.attachment-gallery--2 > .attachment, .trix-content .attachment-gallery.attachment-gallery--4 > action-text-attachment,
.trix-content .attachment-gallery.attachment-gallery--4 > .attachment {
  flex-basis: 50%;
  max-width: 50%;
}

.trix-content action-text-attachment .attachment {
  padding: 0 !important;
  max-width: 100% !important;
}
/* Audit Logs Styles */

/* Filters Section */
.audit-filters {
  background: var(--gray-100, #f8f9fa);
  padding: 1.5rem;
  border-radius: 8px;
  margin-bottom: 2rem;
}

.audit-filters__form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.filter-row {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  align-items: flex-end;
}

.filter-group {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 180px;
  flex: 1;
}

.filter-group label {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--gray-700, #495057);
}

.filter-actions {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  align-items: flex-end;
}

.filter-actions .btn {
  white-space: nowrap;
}

/* Summary */
.audit-summary {
  margin-bottom: 1rem;
  color: var(--gray-600, #6c757d);
  font-size: 0.875rem;
}

/* Table Styles */
.audit-table {
  width: 100%;
  border-collapse: collapse;
  background: white;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.audit-table th,
.audit-table td {
  padding: 0.75rem 1rem;
  text-align: left;
  border-bottom: 1px solid var(--gray-200, #e9ecef);
}

.audit-table th {
  background: var(--gray-50, #f8f9fa);
  font-weight: 600;
  font-size: 0.875rem;
  color: var(--gray-700, #495057);
}

.audit-table tbody tr:hover {
  background: var(--gray-50, #f8f9fa);
}

.audit-timestamp {
  font-size: 0.875rem;
  color: var(--gray-600, #6c757d);
  white-space: nowrap;
}

.audit-type {
  font-weight: 500;
}

.audit-type .type-name {
  display: block;
  font-weight: 500;
  color: var(--gray-800, #343a40);
}

.audit-type .type-detail {
  display: block;
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--gray-600, #6c757d);
  line-height: 1.4;
}

.audit-record {
  max-width: 250px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.audit-user {
  font-size: 0.875rem;
  color: var(--gray-600, #6c757d);
}

.audit-context {
  font-size: 0.875rem;
}

.audit-context span {
  display: block;
  line-height: 1.4;
}

.context-platform {
  font-weight: 500;
  color: var(--gray-800, #343a40);
}

.context-collection {
  color: var(--gray-600, #6c757d);
  font-size: 0.8125rem;
}

.context-partner-org {
  color: var(--gray-500, #868e96);
  font-size: 0.8125rem;
  font-style: italic;
}

/* Action Badges */
.action-badge {
  display: inline-block;
  padding: 0.25rem 0.5rem;
  border-radius: 4px;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.025em;
}

.action-badge--created {
  background: #d4edda;
  color: #155724;
}

.action-badge--updated {
  background: #cce5ff;
  color: #004085;
}

.action-badge--destroyed {
  background: #f8d7da;
  color: #721c24;
}

.action-badge--large {
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
}

/* Detail View */
.audit-detail {
  background: white;
  border-radius: 8px;
  padding: 1.5rem;
  margin-bottom: 2rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.audit-detail__header {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--gray-200, #e9ecef);
}

.audit-detail__header h2 {
  margin: 0;
}

.audit-attributes {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem;
}

.audit-attribute {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.audit-attribute dt {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--gray-500, #6c757d);
}

.audit-attribute dd {
  margin: 0;
  font-size: 1rem;
}

.audit-attribute--wide {
  grid-column: 1 / -1;
}

/* Changes Table */
.audit-changes {
  background: white;
  border-radius: 8px;
  padding: 1.5rem;
  margin-bottom: 2rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.audit-changes h3 {
  margin-top: 0;
  margin-bottom: 1rem;
}

.changes-table {
  width: 100%;
  border-collapse: collapse;
}

.changes-table th,
.changes-table td {
  padding: 0.75rem;
  text-align: left;
  border: 1px solid var(--gray-200, #e9ecef);
  vertical-align: top;
}

.changes-table th {
  background: var(--gray-50, #f8f9fa);
  font-weight: 600;
  font-size: 0.875rem;
}

.changes-table .field-name {
  font-weight: 500;
  width: 25%;
}

.changes-table .field-nested-key {
  display: block;
  font-weight: 400;
  font-size: 0.85em;
  color: var(--gray-600, #4b5563);
  padding-left: 0.75rem;
  border-left: 2px solid var(--gray-200, #e5e7eb);
  margin-left: 0.25rem;
}

.changes-table .old-value {
  background: #fff5f5;
}

.changes-table .new-value {
  background: #f0fff4;
}

.changes-table pre {
  margin: 0;
  font-size: 0.75rem;
  white-space: pre-wrap;
  word-break: break-word;
}

.changes-table em {
  color: var(--gray-500, #6c757d);
  font-style: italic;
}

.side-effect-tag {
  display: inline-block;
  margin-left: 0.4rem;
  padding: 0.1rem 0.4rem;
  border-radius: 3px;
  background: var(--gray-100, #f3f4f6);
  color: var(--gray-600, #6b7280);
  font-size: 0.7rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  vertical-align: middle;
  cursor: help;
}

.audit-triggered-by {
  background: #fff7ed;
  border-left: 4px solid #fb923c;
  border-radius: 4px;
  padding: 1rem 1.25rem;
  margin-bottom: 1.5rem;
}

.audit-triggered-by h3 {
  margin: 0 0 0.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: #9a3412;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.audit-triggered-by__summary {
  margin: 0 0 0.25rem;
  font-size: 1rem;
  color: var(--gray-800, #1f2937);
  font-weight: 500;
}

.audit-triggered-by__note {
  margin: 0;
  font-size: 0.8125rem;
  color: var(--gray-600, #6b7280);
  font-style: italic;
}

/* Metadata Section */
.audit-metadata {
  background: white;
  border-radius: 8px;
  padding: 1.5rem;
  margin-bottom: 2rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.audit-metadata h3 {
  margin-top: 0;
  margin-bottom: 1rem;
}

.metadata-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem;
}

.metadata-item {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.metadata-item dt {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--gray-500, #6c757d);
}

.metadata-item dd {
  margin: 0;
}

/* Link Section */
.audit-link {
  background: white;
  border-radius: 8px;
  padding: 1.5rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.audit-link h3 {
  margin-top: 0;
  margin-bottom: 1rem;
}

/* Empty State */
.empty-state {
  text-align: center;
  padding: 3rem;
  color: var(--gray-500, #6c757d);
}

/* Pagination */
.pagination-wrapper {
  margin-top: 2rem;
  display: flex;
  justify-content: center;
}

/* Responsive */
@media (max-width: 768px) {
  .filter-row {
    flex-direction: column;
  }

  .filter-group {
    width: 100%;
  }

  .audit-table {
    font-size: 0.875rem;
  }

  .audit-table th,
  .audit-table td {
    padding: 0.5rem;
  }

  .audit-record {
    max-width: 150px;
  }
}
* {
    box-sizing: border-box;
}
:root,
body {
    background: #fff;
    color: var(--gray-dark);
    margin: 0;
    min-height: 100vh;
    min-height: 100dvh;
    padding: 0;
}
:root {
    --accent-darker: #6fc4cb;
    --accent-base: #b2e0e4;
    --accent-lighter: #d8eff1;
    --accent-lightest: #f6fcfc;
    --danger-darker: #e8595a;

    --gray-dark: #313131;
    --gray-base: #666;
    --gray-light: #969696;
    --gray-lighter: #ccc;
    --gray-lightest: #fafafa;
    --font-family: Interstate, Overpass, sans-serif;

    --select-arrow: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="13" height="8"><path fill="%23313131" fill-rule="evenodd" d="m7.01 7.222 5.19-5.538A1 1 0 0 0 11.472 0H1.088a1 1 0 0 0-.73 1.684L5.55 7.222a1 1 0 0 0 1.46 0Z"/></svg>');
    font: normal 1rem var(--font-family);
}

main {
    margin: 3.75rem 1.875rem 1.875rem;
    max-width: 90rem;
    padding-bottom: 1.875rem;
}
@media (min-width: 93.75rem) {
    main {
        margin: 3.75rem auto 1.875rem;
    }
}

a {
    color: var(--accent-darker);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 400;
    margin: 0;
    text-transform: uppercase;
}


h1 {
    font: normal 2.25rem / 1.2 var(--font-family);
    grid-column: 1;
    letter-spacing: calc(-0.15 / 56 * 1em);
}
@media (max-width: 1400px) {
    h1 {
        font-size: 2rem;
    }
}
@media (max-width: 1200px) {
    h1 {
        font-size: 1.75rem;
    }
}
@media (max-width: 968px) {
    h1 {
        font-size: 1.5rem;
    }
}
@media (max-width: 768px) {
    h1 {
        font-size: 1.25rem;
    }
}

h2,
caption {
    font: normal 1.5rem / 1.2 var(--font-family);
    letter-spacing: calc(-0.26 / 24 * 1em);
    line-height: calc(29 / 24);
    text-transform: uppercase;
}

p {
    font-weight: 300;
    letter-spacing: calc(-0.17 / 16 * 1em);
    line-height: 1.375;
}

button,
input,
select,
textarea {
    font-family: inherit;
}
input,
textarea {
    border: solid 1px var(--gray-lighter);
    border-radius: 0.25rem;
    color: var(--gray-dark);
    font-size: 1rem;
    letter-spacing: calc(-0.17 / 16 * 1em);
    line-height: calc(8 / 7);
}
input {
    padding: 0.5rem 0.875rem;
}
label {
    font-size: 1.125rem;
    letter-spacing: calc(-0.19 / 18 * 1em);
    line-height: 1.16666666;
}
select {
    appearance: none;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="13" height="8"><path fill="%23313131" fill-rule="evenodd" d="m7.01 7.222 5.19-5.538A1 1 0 0 0 11.472 0H1.088a1 1 0 0 0-.73 1.684L5.55 7.222a1 1 0 0 0 1.46 0Z"/></svg>') no-repeat right 0.5rem center / 1rem 0.5rem, linear-gradient(to bottom, #fdfdfd, #e5e5e5);
    border: solid 1px var(--gray-lighter);
    border-radius: 0.25rem;
    color: var(--gray-light);
    display: block;
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: calc(-0.15 / 14 * 1em);
    padding: 0.5rem 2rem 0.5rem 0.875rem;
}
select[multiple] {
    background-image: none;
    padding: 0.5rem 0.875rem;
}
select:disabled,
select[multiple]:disabled {
    background: var(--gray-lighter);
    border: solid 1px var(--gray-lightest);
    color: var(--gray-dark);
    opacity: 0.6;
    cursor: not-allowed;
}

textarea {
    box-shadow: inset 0 1px 2px rgba(0,0,0,0.5);
    max-width: 100%;
    padding: 0.5rem 0.875rem;
    width: 100%;
}
textarea:disabled {
    background: var(--gray-lighter);
    border: solid 1px var(--gray-lightest);
    color: var(--gray-dark);
    opacity: 0.6;
    cursor: not-allowed;
}

input[type="submit"],
input[type="button"],
input[type="reset"],
button,
.button {
    background-color: var(--gray-lightest);
    border: solid 1px var(--gray-lighter);
    border-radius: 0.25rem;
    color: var(--accent-darker);
    display: inline-block;
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: calc(-0.15 / 14 * 1em);
    padding: 0.5rem 0.875rem;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
}

input[type="submit"]:disabled,
input[type="button"]:disabled,
input[type="reset"]:disabled,
button:disabled,
.button:disabled {
    background-color: var(--gray-lighter); /* Lighter gray to indicate disabled */
    border: solid 1px var(--gray-lightest);
    color: var(--gray-dark); /* Muted text color */
    cursor: not-allowed; /* Show a "not allowed" cursor */
    opacity: 0.6; /* Reduce opacity to indicate disabled state */
}

input[type="checkbox"] {
    transform: scale(1.5);
    width: auto;
}

iframe {
    border: none;
}
::backdrop {
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    background: rgba(0,0,0,0.2);
}
dialog {
    background: #fff;
    border: none;
    border-radius: 0.5rem;
    box-shadow: 0 2px 1.25rem rgba(0,0,0,0.5);
}
dialog[open] {
    height: calc(100vh);
    width: 90vw;
}
dialog > button {
    background: transparent;
    border: none;
    border-radius: 0 0.5rem 0 0;
    padding: 1.25rem 1.25rem 0 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
}
dialog > button > svg {
    display: block;
}
dialog > iframe {
    height: 100%;
    width: 100%;
}
dialog > img {
    height: 100%;
    object-fit: scale-down;
    object-position: center;
    width: 100%;
}
/* Under-review review board (non-FLITE collections).
 *
 * Lives inside the existing amber .under-review-collapsible box, so the chrome
 * (toggle bar, count pill, View Rejected link) comes from dashboards.css and
 * only the board itself is styled here. FLITE keeps the legacy .under-review-*
 * grid — do not fold these rules into those.
 */

/* The shared .under-review-content box clamps to 300px and scrolls, which is
   right for the legacy grid but would bury the board's column footers below an
   outer scrollbar. The board sizes itself instead: each column scrolls its own
   card list and keeps its footer pinned.

   Doubled class for specificity: dashboards.css defines .under-review-content
   at the same weight and sorts after this file in the require_tree bundle, so a
   single class here would lose. */
.under-review-content.under-review-content--board {
    max-height: none;
    overflow: visible;
    padding: 0;
}

.review-board {
    background: #fff;
    overflow-x: auto;
    overflow-y: hidden;

    /* Card metrics, kept here so the column-height math below reads as "N
       cards" instead of a magic pixel total. An untagged card is 50px: the
       32px logo row plus 0.5rem padding top and bottom plus its 1px borders.
       A tagged card runs ~19px taller, so this is the nominal card — the cap
       it feeds is a max-height, not a fixed one, and a heavily tagged column
       simply shows a card or two fewer before it scrolls. */
    --review-card-h: 50px;
    --review-card-gap: 0.375rem;
    /* Room for this many cards before a column starts scrolling. */
    --review-column-cards: 9;
    /* ...and this many before it stops shrinking, so a one-card column still
       reads as a drop target rather than a sliver. */
    --review-column-cards-min: 3;
}

.review-board__rail {
    display: flex;
    align-items: stretch;
    min-width: min-content;
}

/* Filter strip above the columns. */
.review-board__tools {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--line-soft);
    background: var(--wash);
}

.review-board__filter {
    flex: 0 1 260px;
    padding: 0.375rem 0.5rem;
    font-family: inherit;
    font-size: 0.8125rem;
    color: var(--ink);
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--radius-ctl);
}

.review-board__filter-clear {
    flex: 0 0 auto;
}

/* Who else is on this board right now. */
.review-board__presence {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    margin-left: auto;
}

.review-board__presence-chip {
    padding: 0.125rem 0.5rem;
    font-size: 0.6875rem;
    font-weight: 600;
    white-space: nowrap;
    color: var(--blue-ink);
    background: var(--blue-wash);
    border: 1px solid var(--blue-line);
    border-radius: var(--radius-pill);
}

.review-card.is-filtered-out {
    display: none;
}

/* ---- column ---- */

/* Content-driven height: the column is as tall as head + cards + footer needs,
   so a two-card board is a short box instead of a mostly-empty 72vh one. The
   cap lives on .review-column__body (below) — once the cards exceed it the body
   scrolls rather than the page growing. align-items:stretch on the rail then
   levels every column to the tallest, so the footers stay in a row. */
.review-column {
    flex: 1 0 284px;
    min-width: 284px;
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--line-soft);
    background: #fff;
}

.review-column:last-child {
    border-right: none;
}

.review-column__head {
    padding: 0.75rem 0.75rem 0.625rem;
    border-bottom: 1px solid var(--line-soft);
    background: var(--wash);
}

.review-column__name {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
}

.review-column__name h5 {
    margin: 0;
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--ink);
}

.review-column__total {
    flex-shrink: 0;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--text-muted);
    background: var(--pill-track);
    border-radius: var(--radius-pill);
    padding: 0.0625rem 0.4375rem;
    font-variant-numeric: tabular-nums;
}

/* Sized to be readable across every column at once — the whole point of
   keeping all subtopics on screen is spotting a lopsided set of picks. */
.review-column__ticked {
    margin-top: 0.5rem;
    display: flex;
    align-items: baseline;
    gap: 0.375rem;
    font-variant-numeric: tabular-nums;
}

.review-column__ticked b {
    font-size: 1.25rem;
    line-height: 1;
    font-weight: 700;
    color: var(--green-ink);
}

.review-column__ticked.is-none b {
    color: var(--text-faint);
}

.review-column__ticked span {
    font-size: 0.6875rem;
    color: var(--text-faint);
}

.review-column__read {
    margin-top: 0.375rem;
    font-size: 0.6875rem;
    color: var(--text-faint);
    font-variant-numeric: tabular-nums;
}

.review-column__bar {
    margin-top: 0.3125rem;
    height: 3px;
    background: var(--pill-track);
    border-radius: var(--radius-pill);
    overflow: hidden;
}

.review-column__fill {
    height: 100%;
    background: var(--teal-ink);
    transition: width 0.25s ease;
}

/* The body is what sets the board's height: it grows with its cards up to
   --review-column-cards, then scrolls. Sizing the cap here rather than on the
   column means it doesn't have to hardcode the head and footer heights.
   min()'d against the viewport so a tall board still fits a laptop screen. */
.review-column__body {
    flex: 1 1 auto;
    min-height: calc(var(--review-column-cards-min) * var(--review-card-h) +
                     (var(--review-column-cards-min) - 1) * var(--review-card-gap) + 1rem);
    max-height: min(
        calc(var(--review-column-cards) * var(--review-card-h) +
             (var(--review-column-cards) - 1) * var(--review-card-gap) + 1rem),
        62vh);
    padding: 0.5rem;
    display: flex;
    flex-direction: column;
    gap: var(--review-card-gap);
    overflow-y: auto;
    scrollbar-width: thin;
}

.review-column__empty {
    font-size: 0.75rem;
    color: var(--text-faint);
    text-align: center;
    padding: 1.25rem 0.5rem;
    border: 1px dashed var(--line);
    border-radius: var(--radius-item);
}

/* Never scrolls away from the column it acts on. margin-top:auto pins it to the
   bottom when a neighbouring column is taller (a wrapped subtopic title, say)
   and this one's capped body can't stretch to fill the difference. */
.review-column__foot {
    flex: 0 0 auto;
    margin-top: auto;
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    padding: 0.5rem;
    border-top: 1px solid var(--line-soft);
    background: var(--wash);
}

/* A lone subtopic column spans the whole board — don't let its footer
   buttons balloon with it. No effect at normal column width. */
.review-column__foot .review-btn {
    max-width: 16rem;
}

/* ---- card ---- */

.review-card {
    position: relative;
    display: grid;
    grid-template-columns: 20px 32px 1fr 24px;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.5rem 0.5rem 0.25rem;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--radius-item);
    box-shadow: 0 1px 2px rgba(17, 24, 39, 0.06);
    cursor: grab;
    transition: border-color 0.15s, box-shadow 0.15s, transform 0.12s, background 0.15s;
}

.review-card:hover {
    border-color: var(--amber-accent);
    box-shadow: 0 8px 24px rgba(17, 24, 39, 0.14);
    transform: translateY(-1px);
}

.review-card:active {
    cursor: grabbing;
}

.review-card.is-picked {
    background: var(--green-wash);
    border-color: var(--green-line);
}

.review-card__rank {
    text-align: center;
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--text-faint);
    font-variant-numeric: tabular-nums;
    user-select: none;
}

.review-card.is-picked .review-card__rank {
    color: var(--green-ink);
}

.review-card__logo {
    width: 32px;
    height: 32px;
    border-radius: var(--radius-ctl);
    object-fit: cover;
    background: var(--wash);
    border: 1px solid var(--line-soft);
    pointer-events: none;
}

.review-card__body {
    min-width: 0;
    pointer-events: none;
}

.review-card__name {
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--ink);
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.review-card__meta {
    margin-top: 0.0625rem;
    font-size: 0.6875rem;
    color: var(--text-faint);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Age + note chips. pointer-events is re-enabled because .review-card__body is
   pointer-events:none (so drags/clicks hit the card) — without this their title
   tooltips never appear. Clicks still bubble to the card, so opening the reader
   is unaffected. */
.review-card__age,
.review-card__note {
    pointer-events: auto;
    display: inline-block;
    margin-right: 0.375rem;
    font-size: 0.6875rem;
    font-variant-numeric: tabular-nums;
    color: var(--text-faint);
}

/* Sitting in review for over three weeks. */
.review-card__age.is-old {
    color: var(--amber-ink);
    font-weight: 700;
}

.review-card__note {
    color: var(--teal-ink);
}

/* Tag chips. Kept to one line — a card carrying six tags shouldn't be three
   times the height of its neighbours in a column you're ranking by eye. */
.review-card__tags {
    display: flex;
    gap: 0.25rem;
    margin-top: 0.1875rem;
    overflow: hidden;
    white-space: nowrap;
}

.review-card__tag {
    flex: 0 0 auto;
    max-width: 8rem;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0.0625rem 0.3125rem;
    font-size: 0.625rem;
    font-weight: 600;
    line-height: 1.4;
    border-radius: var(--radius-pill);
}

/* Cleared once the startup has been opened. */
.review-card__unread {
    position: absolute;
    left: 0.5rem;
    top: 0.375rem;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--teal-ink);
}

.review-card.is-read .review-card__unread {
    display: none;
}

.review-card__pick {
    width: 22px;
    height: 22px;
    padding: 0;
    display: grid;
    place-items: center;
    border: 1.5px solid var(--line);
    border-radius: var(--radius-ctl);
    background: #fff;
    color: transparent;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
}

.review-card__pick:hover {
    border-color: var(--green-accent);
}

.review-card.is-picked .review-card__pick {
    background: var(--green-accent);
    border-color: var(--green-accent);
    color: #fff;
}

/* ---- buttons ---- */

/* base.css's button display:inline-block overrides the UA [hidden] rule
   (same trap flite_platform.css:2968 documents) — restore it here. */
.review-btn[hidden] {
    display: none;
}

.review-btn {
    flex: 1 1 0;
    min-width: 0;
    padding: 0.4375rem 0.375rem;
    font-size: 0.6875rem;
    font-weight: 600;
    line-height: 1.1;
    white-space: nowrap;
    color: var(--text-muted);
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--radius-ctl);
    cursor: pointer;
}

.review-btn:hover:not(:disabled) {
    border-color: var(--text-faint);
    color: var(--ink);
}

.review-btn:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.review-btn--commit {
    flex: 1 1 100%;
    background: var(--green-accent);
    border-color: var(--green-accent);
    color: #fff;
    font-weight: 700;
}

.review-btn--commit:hover:not(:disabled) {
    background: var(--green-accent-hover);
    border-color: var(--green-accent-hover);
    color: #fff;
}

.review-btn--commit:disabled {
    background: var(--pill-track);
    border-color: var(--line);
    color: var(--text-faint);
}

.review-btn--approve {
    flex: 0 0 auto;
    background: var(--green-wash);
    border-color: var(--green-line);
    color: var(--green-ink);
    font-weight: 700;
}

.review-btn--reject {
    flex: 0 0 auto;
    background: var(--red-wash);
    border-color: var(--red-line);
    color: var(--red-ink);
    font-weight: 700;
}

/* Remove, in the pipeline reader's footer. Quieter than Reject — it sits next
   to navigation, not to a decision, and shouldn't read as the obvious next
   click. Colour arrives on hover. */
.review-btn--danger {
    flex: 0 0 auto;
    color: var(--text-faint);
}

.review-btn--danger:hover:not(:disabled) {
    background: var(--red-wash);
    border-color: var(--red-line);
    color: var(--red-ink);
}

.review-btn--tick {
    flex: 0 0 auto;
    background: var(--green-accent);
    border-color: var(--green-accent);
    color: #fff;
    font-weight: 700;
}

.review-btn--tick.is-picked {
    background: var(--green-wash);
    border-color: var(--green-line);
    color: var(--green-ink);
}

/* ---- reader overlay ---- */

.review-reader {
    position: fixed;
    inset: 0;
    z-index: 1200;
}

.review-reader__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(17, 24, 39, 0.5);
}

.review-reader__dialog {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(720px, calc(100vw - 2rem));
    max-height: min(86vh, 800px);
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 10px;
    box-shadow: 0 24px 64px rgba(17, 24, 39, 0.28);
    overflow: hidden;
}

/* The shell the controller builds wraps the fetched partial, so IT is the
   dialog's only flex child — head/body/foot are its children, not the
   dialog's. Without this the wrapper sizes to its content and the footer
   overflows past the dialog's bottom edge, where overflow:hidden clips it. */
.review-reader__content {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.review-reader__head {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 1rem;
    border-bottom: 1px solid var(--line-soft);
}

/* Height-locked, width-free. A square mark renders 46x46 as before; a wide
   wordmark keeps its aspect ratio out to 160px instead of being centre-cropped
   into an unreadable slice by object-fit:cover. The header is a flex row with
   room to spare, so the extra width costs nothing. */
.review-reader__logo {
    height: 46px;
    width: auto;
    min-width: 46px;
    max-width: 160px;
    border-radius: var(--radius-item);
    object-fit: contain;
    background: var(--wash);
    border: 1px solid var(--line-soft);
    flex: 0 0 auto;
}

.review-reader__id {
    flex: 1;
    min-width: 0;
}

.review-reader__name {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.2;
    /* base.css uppercases every heading; a company name is a proper noun and
       should read as it's written. */
    text-transform: none;
}

.review-reader__sub {
    margin-top: 0.1875rem;
    font-size: 0.75rem;
    color: var(--text-faint);
}

.review-reader__profile {
    font-size: 0.75rem;
    color: var(--text-muted);
    white-space: nowrap;
}

.review-reader__close {
    padding: 0 0.125rem;
    background: none;
    border: 0;
    font-size: 1.375rem;
    line-height: 1;
    color: var(--text-faint);
    cursor: pointer;
}

.review-reader__close:hover {
    color: var(--ink);
}

.review-reader__body {
    flex: 1;
    /* A flex item won't shrink below its content without this, so a tall body
       (images + files) would squeeze the footer and eat its padding — leaving
       the action buttons flush against the bottom edge of the dialog. */
    min-height: 0;
    padding: 1rem;
    overflow-y: auto;
}

.review-reader__summary {
    max-width: 68ch;
    margin-bottom: 1rem;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--text-muted);
}

.review-reader__summary p {
    margin: 0 0 0.5rem;
}

.review-reader__facts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 0.75rem 1rem;
    margin: 0;
    padding: 0.875rem;
    background: var(--wash);
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-item);
}

.review-reader__facts dt {
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-faint);
}

.review-reader__facts dd {
    margin: 0.1875rem 0 0;
    font-size: 0.8125rem;
    font-variant-numeric: tabular-nums;
    word-break: break-word;
}

.review-reader__email {
    font-size: 0.75rem;
    color: var(--text-muted);
}

.review-reader__field {
    margin-top: 1rem;
}

/* Inline image gallery. Screenshots and slides are evidence — they get the
   reader's full width rather than a thumbnail you can't read. */
.review-reader__gallery {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 0.5rem;
}

.review-reader__shot {
    display: block;
    aspect-ratio: 16 / 10;
    background: var(--wash);
    border: 1px solid var(--line);
    border-radius: var(--radius-item);
    overflow: hidden;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.review-reader__shot img {
    display: block;
    width: 100%;
    height: 100%;
    /* Contain, not cover: never crop the thing being judged. Portraits
       letterbox onto the neutral ground instead. */
    object-fit: contain;
}

.review-reader__shot:hover,
.review-reader__shot:focus-visible {
    border-color: var(--teal-ink);
    box-shadow: 0 0 0 2px rgba(63, 143, 150, 0.25);
}

/* File rows. Deliberately NOT the global .construct-list > .file grid: that
   one reserves a 60px icon gutter and named areas for a category/hamburger
   this list doesn't have, which left a dead column and a stray rule. */
.review-reader__files {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.review-reader__file {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0.625rem;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--radius-item);
    color: inherit;
    text-decoration: none;
    transition: border-color 0.15s, background 0.15s;
}

.review-reader__file:hover,
.review-reader__file:focus-visible {
    border-color: var(--teal-ink);
    background: var(--teal-wash);
}

.review-reader__file-icon {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
}

.review-reader__file-text {
    flex: 1;
    min-width: 0;
}

.review-reader__file-name {
    display: block;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--ink);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.review-reader__file-meta {
    display: block;
    margin-top: 0.0625rem;
    font-size: 0.6875rem;
    color: var(--text-faint);
    font-variant-numeric: tabular-nums;
}

/* Says what the click does — previewing and downloading shouldn't look alike. */
.review-reader__file-action {
    flex: 0 0 auto;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--teal-ink);
}

.review-reader__label {
    display: block;
    margin-bottom: 0.375rem;
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-faint);
}

.review-reader__hint {
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    font-style: italic;
}

.review-reader__select,
.review-reader__note {
    width: 100%;
    padding: 0.5rem;
    font-family: inherit;
    font-size: 0.8125rem;
    color: var(--ink);
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--radius-ctl);
}

.review-reader__note {
    line-height: 1.5;
    resize: vertical;
}

.review-reader__status {
    display: inline-block;
    margin-top: 0.25rem;
    font-size: 0.6875rem;
    color: var(--text-faint);
    min-height: 1em;
}

/* ---- tags ---- */

/* Assigned pills reuse the .tag-pill styling the cards and the kebab already
   use, so a tag looks the same everywhere it appears. */
/* Unconditional margin: ERB leaves whitespace text nodes inside, so :empty
   never matches an actually-empty pill list. */
.review-reader__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    margin-bottom: 0.5rem;
}

/* Select and its Add button on one line; the status note wraps below. */
.review-reader__tag-add {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.review-reader__tag-add .review-reader__select {
    flex: 1 1 12rem;
    width: auto;
}

.review-reader__tag-add .review-btn {
    flex: 0 0 auto;
}

.review-reader__tag-add .review-reader__status {
    flex-basis: 100%;
    margin-top: 0;
}

.review-reader__foot {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--line-soft);
    background: var(--wash);
}

.review-reader__foot .review-btn {
    flex: 0 0 auto;
}

.review-reader__pos {
    font-size: 0.75rem;
    color: var(--text-faint);
    font-variant-numeric: tabular-nums;
}

/* Pipeline reader for a user who may read the note but not write it.
   simple_format supplies the <p> wrapping, so no pre-wrap here. */
.review-reader__note-readonly {
    font-size: 0.8125rem;
    line-height: 1.5;
    color: var(--ink);
}

.review-reader__note-readonly p {
    margin: 0 0 0.5rem;
}

.review-reader__note-readonly p:last-child {
    margin-bottom: 0;
}

.review-reader__spacer {
    flex: 1;
}

@media (max-width: 720px) {
    .review-column {
        flex: 1 0 250px;
        min-width: 250px;
    }

    /* Less vertical room to spend on one column when the board is also
       scrolling sideways. */
    .review-board {
        --review-column-cards: 6;
    }
}

/* ---- realtime: attribution chips, notices, banners, reader lock ---- */

/* Transient "ticked by mark" / "moved by mark" chip on a card. */
.review-card__flash {
    position: absolute;
    right: 2rem;
    top: -0.5rem;
    z-index: 2;
    padding: 0.125rem 0.4375rem;
    font-size: 0.625rem;
    font-weight: 700;
    white-space: nowrap;
    color: #fff;
    background: var(--teal-ink);
    border-radius: var(--radius-pill);
    box-shadow: 0 1px 3px rgba(17, 24, 39, 0.25);
    pointer-events: none;
}

/* A card someone else just decided: fade before removal. */
.review-card.is-remote-removing {
    opacity: 0;
    transition: opacity 0.8s ease;
    pointer-events: none;
}

.review-dismiss {
    flex-shrink: 0;
    padding: 0 0.25rem;
    background: none;
    border: 0;
    font-size: 1rem;
    line-height: 1;
    color: inherit;
    opacity: 0.7;
    cursor: pointer;
}

.review-dismiss:hover {
    opacity: 1;
}

/* Board-level "mark added a subtopic — refresh to update" strip. */
.review-board__banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--amber-ink);
    background: var(--amber-wash);
    border-bottom: 1px solid var(--amber-line);
}

/* Column-head "mark committed this column" banner (a decision, green). */
.review-column__banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.375rem;
    margin-top: 0.4375rem;
    padding: 0.25rem 0.4375rem;
    font-size: 0.6875rem;
    font-weight: 600;
    color: var(--green-ink);
    background: var(--green-wash);
    border: 1px solid var(--green-line);
    border-radius: var(--radius-ctl);
}

/* Reader banner when the open startup was decided by someone else. */
.review-reader__lockbar {
    padding: 0.625rem 1rem;
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--amber-ink);
    background: var(--amber-wash);
    border-bottom: 1px solid var(--amber-line);
}

.review-reader__select:disabled,
.review-reader__note:disabled {
    background: var(--wash);
    color: var(--text-faint);
    cursor: not-allowed;
}

/* ---- platform page layout ---- */
/* (The old Files/Partner-Orgs meta-row is gone: files live in a header
   popover, orgs on the settings page. Page-frame rules live in
   workspace_redesign.css under .platform-workspace-page.) */

/* Pipeline-card stage · funding · location line (added with the card rework).
   Base look here so the collection page's not-yet-redesigned cards render it
   small and quiet too; workspace_redesign.css refines it on the platform page. */
.pipeline-column-content .startup .startup__meta {
    color: var(--text-faint);
    font-size: 0.75rem;
    line-height: 1.35;
    margin-top: 0.0625rem;
}

/* Days in the current stagegate — the pipeline's counterpart to the review
   card's age chip, and styled to match it. */
.pipeline-column-content .startup .startup__age {
    margin-right: 0.375rem;
    font-variant-numeric: tabular-nums;
}

.pipeline-column-content .startup .startup__age.is-old {
    color: var(--amber-ink);
    font-weight: 700;
}

/* Quiet secondary action in the Topics header (was a whole orphaned
   "Startups Export" section whose only content was this button). */
.workspace-export-link {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-muted);
    text-decoration: none;
    padding: 0.3125rem 0.625rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-ctl);
    white-space: nowrap;
}

.workspace-export-link:hover {
    color: var(--ink);
    border-color: var(--text-faint);
}

/* ---- platform page: collection workspace tabs ---- */

.collection-workspace__tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    /* Tabs sit ON the panel: no gap, active tab merges with the panel border. */
    margin-bottom: -1px;
    position: relative;
    z-index: 1;
    padding: 0 0.5rem;
}

.collection-workspace__tab {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4375rem 0.75rem;
    font-family: inherit;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text-muted);
    background: var(--wash);
    border: 1px solid var(--line);
    border-radius: var(--radius-item) var(--radius-item) 0 0;
    border-bottom-width: 2px;
    border-bottom-color: transparent;
    cursor: pointer;
}

.collection-workspace__tab:hover {
    color: var(--ink);
    border-color: var(--text-faint);
}

.collection-workspace__tab.is-active {
    color: var(--ink);
    background: #fff;
    border-color: var(--line);
    /* Opens into the panel below. */
    border-bottom-color: #fff;
    border-bottom-width: 1px;
}

.collection-workspace__tab.is-active .collection-workspace__tab-name {
    box-shadow: inset 0 -2px 0 var(--teal-ink);
    padding-bottom: 0.125rem;
}

/* The panel the tabs open into. */
.collection-workspace__panel {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
    padding: 1rem 1.25rem 1.25rem;
}

/* The frame content's own <section> brings page-level headings; calm them
   inside the panel. */
.collection-workspace__panel section {
    margin: 0;
}

/* Slim toolbar at the top of a work-area tab (replaces the duplicated
   collection-name heading). */
.work-area-toolbar {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.375rem;
}

.work-area-toolbar__open {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--teal-ink);
    text-decoration: none;
    white-space: nowrap;
    margin-left: auto;
    padding: 0.3125rem 0.625rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-ctl);
    background: #fff;
}

.work-area-toolbar__open:hover {
    color: var(--teal-ink-hover);
    border-color: var(--teal-ink);
}

.collection-workspace__tab-count {
    font-size: 0.6875rem;
    font-weight: 700;
    color: var(--amber-ink);
    background: var(--amber-wash);
    border: 1px solid var(--amber-line);
    border-radius: var(--radius-pill);
    padding: 0.0625rem 0.4375rem;
    font-variant-numeric: tabular-nums;
}

.collection-workspace__loading,
.collection-workspace__empty {
    padding: 2rem 1rem;
    text-align: center;
    color: var(--text-faint);
    font-size: 0.875rem;
    border: 1px dashed var(--line);
    border-radius: var(--radius-card);
}

.work-area-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}

.work-area-header__name {
    margin: 0;
    font-size: 1rem;
}

.work-area-header__link {
    font-size: 0.8125rem;
    white-space: nowrap;
}

/* ---- live pipeline notice ---- */

.pipeline-live__notice {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    padding: 0.375rem 0.625rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--blue-ink);
    background: var(--blue-wash);
    border: 1px solid var(--blue-line);
    border-radius: var(--radius-item);
}

/* Tab switch feedback: Turbo marks a fetching frame [busy] — dim the stale
   content so the click visibly took. */
#collection-work-area[busy] {
    opacity: 0.45;
    pointer-events: none;
    transition: opacity 0.15s ease;
}
main[data-controller~="collections"] {
    display: flex !important;
    flex-direction: column !important;
    gap: 2.5rem;
}

/* Top row: Synopsis (40%), Subtopics (20%), Tags (20%), Files (20%) side-by-side */
.collection-top-row {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 1.5rem;
    align-items: start;
}

.collection-top-row .synopsis-section,
.collection-top-row .subtopics-section,
.collection-top-row .tags-section,
.collection-top-row .files-section {
    min-width: 0; /* Prevent overflow in grid items */
}

/* Tag styling */
.tag-item {
    display: flex;
    align-items: center;
    padding: 0.25rem 0;
}

/* Color indicator circle in tag list */
.tag-color-indicator {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin-right: 0.5rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    flex-shrink: 0;
}

.tag-name {
    flex: 1;
}

/* Color picker in context menu */
.menu-item--color {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 0.75rem;
}

.menu-item--color label {
    font-size: 0.875rem;
    color: #374151;
}

.menu-item--color input[type="color"] {
    width: 32px;
    height: 24px;
    padding: 0;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    cursor: pointer;
}


/* Tag pills for display on startup cards */
.startup__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin-top: 0.25rem;
}

.tag-pill {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    font-size: 0.6875rem;
    background-color: #e0f2fe;
    color: #0369a1;
    border-radius: 9999px;
    white-space: nowrap;
}

.tag-pill--removable {
    padding-right: 0.25rem;
}

.tag-pill .tag-remove-btn {
    background: none;
    border: none;
    color: #0369a1;
    cursor: pointer;
    font-size: 0.75rem;
    padding: 0 0.25rem;
    margin-left: 0.25rem;
    line-height: 1;
}

.tag-pill .tag-remove-btn:hover {
    color: #dc2626;
}

/* Tag assignment section in popover */
.tag-assignment-section {
    margin-top: 0.75rem;
    margin-bottom: 1rem;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    border-top: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;
}

.tag-assignment-section label {
    font-weight: 600;
    font-size: 0.75rem;
    color: #374151;
    display: block;
    margin-bottom: 0.5rem;
}

.assigned-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin-bottom: 0.5rem;
}

.add-tag-section {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.add-tag-section select {
    flex: 1;
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
}

.add-tag-section .add-tag-btn {
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    background: #0369a1;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.add-tag-section .add-tag-btn:hover {
    background: #075985;
}

/* Tag modal styling - reuse subtopic modal styles */
.tag-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tag-modal.hidden {
    display: none;
}

/* Responsive: stack on smaller screens */
@media (max-width: 900px) {
    .collection-top-row {
        grid-template-columns: 1fr;
    }
}

.collection_summary {
    height: 100%;
    overflow: hidden;
}

/* Make the tabs/pipeline full width within the startups section */
main[data-controller~="collections"] .tabs,
main[data-controller~="collections"] .tabs--wide {
    max-width: none;
    width: 100%;
}

/* Ensure pipeline container expands to full width */
main[data-controller~="collections"] .pipeline-full-width {
    width: 100%;
}

main[data-controller~="collections"] .pipeline-container {
    width: 100%;
}

main[data-controller~="collections"] .pipeline-content {
    width: 100%;
}

/* Drag-and-drop visual states for under-review startups */
.sortable-ghost {
    opacity: 0.4;
    background: #fef3c7;
    border: 2px dashed #f59e0b;
    border-radius: 8px;
}

.sortable-chosen {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transform: scale(1.02);
}

.sortable-drag {
    opacity: 1;
}

.under-review-item {
    cursor: grab;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.under-review-item:active {
    cursor: grabbing;
}

.under-review-item:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* ============================================================
   Pipeline CRM card + kebab controls
   Shared by the FLITE pipeline and non-FLITE collection
   pipelines (_pipeline_crm / _collection_startup_crm). These
   replace inline styles verbatim — no visual change. The kebab
   <label> rules are scoped under `popover-toggle [popover]` to
   out-specify the generic 0.875rem label rule.
   ============================================================ */

/* --- Pipeline banners (post-approval submissions / skip-new) --- */
.pipeline-alert {
    background: #fef3cd;
    border: 1px solid #ffc107;
    border-radius: 4px;
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.75rem;
    font-size: 0.8rem;
    color: #856404;
}
.pipeline-alert__skip-new {
    margin-top: 0.5rem;
    padding: 0.4rem 0.5rem;
    background: #fde2e2;
    border: 1px solid #f5a6a6;
    border-radius: 4px;
    color: #991b1b;
    font-size: 0.75rem;
}
.pipeline-alert__list { margin-top: 0.5rem; }
.pipeline-alert__item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0;
    border-top: 1px solid #fde68a;
}
.pipeline-alert__status { color: #92400e; font-size: 0.75rem; }
.pipeline-alert__btn {
    border: none;
    padding: 0.2rem 0.5rem;
    border-radius: 3px;
    font-size: 0.7rem;
    cursor: pointer;
    color: #fff;
}
.pipeline-alert__btn--assign { background: #059669; }
.pipeline-alert__btn--reject { background: #dc2626; }
.pipeline-alert__btn--remove { background: #6b7280; }

/* --- Card body (badges / vote count / note preview) --- */
.startup__new-proposal-badge {
    display: inline-block;
    background: #f59e0b;
    color: #fff;
    font-size: 0.625rem;
    font-weight: 700;
    padding: 0.125rem 0.375rem;
    border-radius: 3px;
    margin-left: 0.25rem;
    vertical-align: middle;
}
.startup__vote-count {
    margin-top: 0.25rem;
    font-size: 0.7rem;
    font-weight: 600;
    color: #6b7280;
}
.startup__approval-comment small {
    color: #059669;
    font-style: italic;
}

/* --- Kebab popover controls (note / subtopic / FLITE tags) --- */
.note-section,
.kebab-platform-tags {
    margin-bottom: 0.75rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #e5e7eb;
}
.subtopic-section,
.kebab-notes { margin-bottom: 0.75rem; }
.note-section .field,
.subtopic-section .field { margin: 0; }
.note-section .actions { margin: 0.5rem 0 0; }
.note-section textarea {
    width: 100%;
    height: 200px;
    font-size: 0.8rem;
    padding: 0.375rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    resize: vertical;
}
.subtopic-section select {
    width: 100%;
    font-size: 0.8rem;
    padding: 0.25rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
}
.note-section strong { font-size: 0.75rem; color: #374151; }
.note-readonly {
    margin: 0.25rem 0 0;
    font-size: 0.8rem;
    color: #059669;
    font-style: italic;
}
.note-save-btn { font-size: 0.75rem; padding: 0.25rem 0.5rem; }
.note-status { margin-left: 0.5rem; font-size: 0.75rem; }
.kebab-platform-tags .proposal-overlay__tags { margin: 0; }
.kebab-empty-hint {
    margin: 0 0 0.5rem;
    font-size: 0.75rem;
    color: #6b7280;
}

/* Kebab labels — scoped to out-specify `popover-toggle [popover] label`. */
popover-toggle [popover] .note-section label,
popover-toggle [popover] .subtopic-section label,
popover-toggle [popover] .kebab-platform-tags label {
    font-size: 0.75rem;
    color: #374151;
    font-weight: 600;
}
popover-toggle [popover] .subtopic-section label,
popover-toggle [popover] .kebab-platform-tags label {
    display: block;
    margin-bottom: 0.25rem;
}

.button--danger {
    color: var(--danger-darker);
}

.button--danger:hover {
    background-color: var(--danger-darker);
    border-color: var(--danger-darker);
    color: #fff;
}

.button--text {
    background: transparent;
    border-color: transparent;
    display: inline-block;
    padding: 0;
}
a:has(> .calendar-box) {
    text-decoration: none;
}
.calendar-box {
    align-items: center;
    background: var(--accent-base);
    color: #000;
    display: flex;
    flex: 0  0 var(--icon-size);
    flex-direction: column;
    height: var(--icon-size);
    padding: 0 0.3125rem 0.3125rem;
    text-align: center;
    width: var(--icon-size);
}

.calendar-box > .day {
    flex: 1 0 1.25rem;
    font-size: 0.75rem;
    font-weight: 900;
    height: 1.25rem;
    letter-spacing: calc(1.07 / 12 * 1em);
    line-height: calc(5 / 4);
}
.calendar-box > .date {
    background: #fff;
    flex: 1 0 auto;
    font-size: 1.5rem;
    font-weight: 700;
    justify-content: center;
    letter-spacing: calc(-0.26 / 24 * 1em);
    line-height: calc(29 / 24);
    width: 100%;
}

.calendar-box--small {
    padding: 0 0.1875rem 0.1875rem;
}
.calendar-box--small > .day {
    flex-basis: 0.5rem;
    font-size: 0.375rem;
    height: 0.5rem;
}
.calendar-box--small > .date {
    font-size: 1rem;
}
expandable-text .summary,
expandable-text button {
    display: none;
}

expandable-text:defined button {
    display: inline-block;
}

expandable-text:defined .summary {
    display: block;
}
expandable-text:defined .fulltext {
    display: none;
}
expandable-text:defined[open] .summary {
    display: none;
}
expandable-text:defined[open] .fulltext {
    display: block;
}
.actions {
    align-items: center;
    display: flex;
    gap: 1rem 2rem;
    justify-content: space-between;
}

.field,
.actions {
    margin: 0 0 1rem;
}
.field + .field,
.field + .actions {
    margin-top: 1rem;
}

.field > label {
    display: block;
    margin-bottom: 0.5rem;
}
.field > label + br {
    display: none;
}
.field .note {
    margin: 0;
}

/* At some future point we could replace this with a :has() selector, but
 * support isn't quite there yet.
 */
.field--checkbox {
    align-items: baseline;
    display: grid;
    grid-gap: 0.25rem 0.5rem;
    grid-template-columns: auto 1fr;
}
.field--checkbox input {
    grid-column: 1;
}
.field--checkbox label {
    grid-column: 2;
}

.form--with-conditional-fields .field--conditional {
    display: none;
}
.small-icon-file-download-wrapper {
    --icon-size: 1.875rem;
    align-items: center;
    margin-bottom: 0.625rem;
}

.small-icon-file-download-wrapper img {
    height: var(--icon-size);
    object-fit: scale-down;
    width: var(--icon-size);
}
.small-icon-file-download-wrapper a {
    align-items: center;
    display: flex;
    gap: 0.625rem;
    max-width: 100%;
}
.flash__wrapper {
    align-items: center;
    display: flex;
    justify-content: center;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
}
.flash {
    align-items: center;
    background: #fff;
    border-radius: 0.25rem;
    box-shadow: 0 0.1rem 0.5rem rgba(0,0,0,0.2);
    display: flex;
    font-weight: 400;
    gap: 0.5rem;
    margin: 1rem;
    max-width: 90rem;
    min-width: 18rem;
    padding: 0.75rem 0.875rem 0.75rem;
}

.flash:empty {
    display: none;
}

.flash--alert {
    border: solid 1px var(--danger-darker);
    color: var(--danger-darker);
}

.flash--notice {
    border: solid 1px var(--accent-darker);
    color: var(--accent-darker);
}

@media (min-width: 93.75rem) {
    .flash {
        margin: 1rem auto 1rem
    }
}
header {
    background-color: #000;
    color: #fff;
    display: grid;
    font-size: 1.125rem;
    grid-template-columns: 1fr 130px 1fr;
}
header > nav {
    padding: 1rem 0.875rem;
}
header.admin {
    grid-auto-flow: column;
    grid-template-rows: min-content 1fr;
}
.admin .admin-nav {
    background: var(--gray-base);
    display: flex;
    font-size: 0.875rem;
    gap: 1.875rem;
    grid-column: 1 / -1;
    grid-row: 1;
    letter-spacing: calc(-0.15 / 14 * 1em);
    padding: 0.75rem 1.875rem;
    text-transform: uppercase;
}
.admin-nav a {
    color: var(--accent-lighter);
}

header a {
    color: var(--accent-base);
    font-weight: 300;
    letter-spacing: calc(-0.19 / 18 * 1em);
    text-decoration: none;
    text-transform: uppercase;
}
header > * {
    grid-row: 1;
}
header.admin > * {
    grid-row: 2;
}

header > .site-logo {
    background-color: #000;
    border-radius: 50%;
    grid-column: 2;
    margin-bottom: -4rem;
    margin-top: 0;
    padding: 1rem;
}

header popover-toggle {
    --popover-background: #000;
    align-self: center;
    justify-self: end;
    margin-right: 0.625rem;
}
header popover-toggle details {
    justify-self: end;
}
header popover-toggle summary {
    color: var(--accent-base);
}

.nav-list {
    display: grid;
    grid-auto-flow: column;
    grid-column: 1;
    grid-gap: 0 1.25rem;
    justify-content: start;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.nav-item a {
    align-items: center;
    border-radius: 1.5rem;
    display: flex;
    justify-items: center;
    min-height: 3.125rem;
    padding: 0 1rem;
    text-decoration: none;
}

.nav-item a:hover {
    text-decoration: underline;
}
.nav-item .current {
    background: var(--accent-base);
    box-shadow: inset 0 1px 3px 0 rgba(0,0,0,0.5);
    color: #000;
}

#user_nav {
    grid-column: 3;
    justify-self: end;
}

.page-header {
    --icon-size: 5rem;
    align-items: end;
    align-items: last baseline;
    display: grid;
    grid-column: 1 / -1;
    grid-gap: 1.25rem 0.625rem;
    grid-template-areas: "logo title . actions"
        "filter filter filter filter";
    grid-template-columns: var(--icon-size) min-content 1fr min-content;
    min-height: var(--icon-size);
}

.page-header--no-logo {
    grid-template-areas: "title . actions"
        "filter filter filter";
    grid-template-columns: min-content 1fr min-content;
}

.page-header .actions {
    grid-area: actions;
    white-space: nowrap;
}
.page-header .logo {
    border: solid 2px var(--accent-lighter);
    grid-area: logo;
    height: var(--icon-size);
    position: relative;
    width: var(--icon-size);
}
.page-header .logo > img {
    height: calc(var(--icon-size) - 4px);
    width: calc(var(--icon-size) - 4px);
}

.page-header .p-name,
.page-header h1 {
    align-items: start;
    display: flex;
    flex-direction: column;
    grid-area: title;
    justify-content: start;
    white-space: nowrap;
}

/* Program logo used as the page title (replaces the platform name text).
   The box has a FIXED height so the header claims the logo's space before
   the image loads — no layout shift when it arrives. The img inside keeps
   max-constraints so small logos aren't upscaled. */
.page-header__brand-logo-box {
    display: flex;
    align-items: center;
    height: 4.5rem;
    margin-bottom: 0.5rem;
}
.page-header__brand-logo {
    max-height: 4.5rem;
    max-width: 420px;
    width: auto;
    display: block;
}

.page-header .p-name::before {
    color: var(--gray-light);
    content: attr(data-pagetype);
    font: normal 0.875rem / 1.15 var(--font-family);
    letter-spacing: calc(-0.15 / 56 * 1em);
}
.page-header .filter {
    grid-area: filter;
}

@media (max-width: 1200px) {
    .page-header {
        grid-template-columns: var(--icon-size) 1fr min-content;
    }
    .page-header--no-logo {
        grid-template-columns: 1fr min-content;
    }
    .page-header .p-name,
    .page-header h1 {
        white-space: normal;
    }
}
/* If the only element in a section__header, or section__subheader is a heading
 * element (h2, or h3 specifically), this class can be applied directly to that
 * element instead of to the wrapper
 */
.section__header {
    align-items: baseline;
    border-bottom: solid 2px var(--accent-base);
    display: flex;
    justify-content: space-between;
    margin-bottom: 1.25rem;
    padding: 0 0 0.5rem;
    text-align: left;
}
.section__header > .actions {
    margin: 0;
}
.section__subheader {
    align-items: baseline;
    display: flex;
    justify-content: space-between;
    margin-top: 1.25rem;
    padding: 0 0 0.5rem;
}

.section__subheader--small {
    font-size: 1.125rem;
    font-weight: 400;
    letter-spacing: calc(-0.19 / 18 * 1em);
    line-height: calc(7 / 6);
    text-transform: none;
}

section,
.section {
    margin-bottom: 1.25rem;
}

.section__header a {
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: calc(-0.15 / 14* 1em);
    line-height: calc(8 / 7);
    text-decoration: none;
    text-transform: uppercase;
}

.tabs {
    /*max-width: calc((100vw - 6.25rem) / 3);*/
}
.tabs--wide {
    /*max-width: calc((100vw - 6.25rem) / 3 * 2);*/
}
@media (min-width: 93.75rem) {
    .tabs {
        max-width: calc(87.5rem / 3);
    }
    .tabs--wide {
        max-width: calc(100rem / 3 * 2);
    }
}
.tab-header {
    border-bottom: solid 1px var(--gray-lighter);
    margin-bottom: 1rem;
}
.tab-nav {
    display: flex;
    flex-wrap: nowrap;
    list-style: '';
    margin-bottom: -1px;
    overflow-x: auto;
    padding: 0 0.5rem 0 0;
}
.tab-nav a {
    background: var(--gray-lightest);
    border: solid 1px var(--gray-lighter);
    border-bottom-color: var(--gray-lighter);
    border-radius: 0.5rem 0.5rem 0 0;
    display: block;
    padding: 0.25rem 0.75rem;
    text-decoration: none;
    white-space: nowrap;
}

.tab-nav li + li {
    margin-left: 5px;
}
.tab-nav .active {
    background: #fff;
    border: solid 1px var(--gray-lighter);
    border-bottom-color: #fff;
    color: var(--gray-dark);
    position: relative;
    z-index: 1;
}

.task-list {
    list-style: '';
    margin: 0;
    padding: 0;
}

.task-list .task {
    border-top: solid 1px var(--accent-lighter);
    display: grid;
    grid-gap: 0.625rem 1.5rem;
    grid-template-columns: 10fr 7fr;
    margin: 0 0 1.25rem;
    padding: 0.625rem 0;
}

.task-list img {
    height: var(--icon-size, 3.75rem);
    margin-top: -0.625rem;
    width: var(--icon-size, 3.75rem);
}

.task-list select,
.task-list textarea {
    width: 100%;
}

/* In general we want our form controls to use 1rem for their text size,
 * 1. It's nice, and tends to look better
 * 2. iOS will zoom in when the control is focused if it has a smaller font-size
 *
 * The design calls for smaller text here, but if we want to maintain the larger
 * text on smaller (touch) devices to prevent the goofy zoom.
 */
@media (hover: hover) {
    .task-list select,
    .task-list textarea {
        font-size: 0.875rem;
    }
}

.task-list .task:last-child {
    margin: 0;
}

.task__header {
    align-items: baseline;
    display: flex;
    justify-content: space-between;
}
.task__wrapper {
    /*border: solid 2px var(--accent-base);*/
    list-style: '';
    padding: 1.25rem;
}
.task__wrapper + .task__wrapper {
    margin-top: 1.25rem;
}
.section__header > .task__wrapper,
.section__header + ol > .task__wrapper:first-child,
.section__header + ul > .task__wrapper:first-child {
    border-top: none;
    margin-top: -1.25rem;
}

.task .new_partner_response .actions {
    margin-bottom: 0;
}
.u-logo {
    display: block;
    height: var(--icon-size, 3.75rem);
    object-fit: scale-down;
    object-position: center;
    width: var(--icon-size, 3.75rem);
}
.meeting_header {
    display: flex;
    flex-direction: row;
}

.create_button {
    border: 1px solid #ebebeb;
    display: flex;
    width: fit-content;
    margin: auto;
    padding: 10px;
    border-radius: 10px;
}

.link {
    text-decoration: none;
}
.link:hover {
    color: #99dde0;
}

.meeting_card {
    margin: 10px;
    border-radius: 10px;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 25px;
    padding-right: 25px;
    background-color: white;
    box-shadow: 0 1px 2px #bab8b6, 0 -1px 1px #cfcbc8;
}

.meeting_startup_list {
    display: flex;
    flex-direction: row;
}


.startup_bubble{
    border: 1px solid #ebebeb;
    width: fit-content;
    height: 25px;
    padding: 10px;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 20px;
    margin-bottom: 10px;
    border-radius: 10px;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.startup_bubble_logo img{
    margin-right: 15px;
    height: 25px;
    width: auto;
}
.construct-list {
    --icon-size: 3.75rem;
    list-style: '';
    padding: 0;
}

.construct-list img:not(.chat-bubble) {
    box-shadow: inset 0 0 0 1px var(--accent-lighter);
    height: var(--icon-size);
    object-fit: scale-down;
    width: var(--icon-size);
}

.construct-list li {
    border-top: solid 1px var(--accent-base);
    margin: 0 0 0.625rem;
    min-height: var(--icon-size);
    padding: 0;
    padding-top: 0.625rem;
}
.construct-list li:first-child {
    border-top: none;
    margin: 0;
    padding: 0;
}
.construct-list popover-toggle {
    align-self: center;
}
.construct-list .p-name {
    color: currentColor;
    display: block;
    font-size: 1rem;
    letter-spacing: calc(-0.17 / 16 * 1em);
    line-height: calc(19 / 16);
    text-decoration: none;
}

.construct-list--tasks {
    --icon-size: 5rem;
    margin: 0 0 1.25rem;
}

.flex-container {
    display: flex;
    flex-wrap: wrap;
}

.flex-container li {
    margin-right: 20px;
    width: calc(50% - 20px); /* adjust width to account for padding */
}

.full-container {
    display: flex;
    flex-wrap: wrap;
}

.full-container li {
    margin-right: 20px;
    width: calc(100% - 20px); /* adjust width to account for padding */
}
.construct-list .collection-startup popover-toggle summary {
    color: var(--accent-base);
}
.construct-list > .collection-startup .p-name,
.construct-list > .collection-startup .hint {
    padding: 0.25rem 0;
}
.construct-list > .collection-startup .p-name {
    color: var(--gray-dark);
}
.construct-list > .collection-startup .u-url {
    align-items: center;
    display: grid;
    grid-gap: 0.625rem;
    grid-template-columns: var(--icon-size) 1fr min-content;
    min-height: var(--icon-size);
    text-decoration: none;
}
.construct-list .collection-startup-meta {
    display: grid;
    grid-auto-flow: column;
    grid-column: 2;
    grid-gap: 0.625rem;
    grid-row: 2;
    justify-content: start;
}
.construct-list .collection-startup-meta > *:empty {
    display: none;
}
.construct-list > .collection-startup--with-meta .hint,
.construct-list > .collection-startup--with-meta .u-logo {
    grid-row: 1 / span 2;
}

.embedded-collection-startup {
    align-items: center;
    display: grid;
    grid-auto-columns: var(--icon-size, 3.75rem) 1fr min-content min-content;
    grid-auto-flow: column;
    grid-gap: 0.625rem;
}
.embedded-collection-startup .collection-startup__summary {
    font-size: 0.875rem;
    letter-spacing: calc(-0.15 / 14 * 1em);
    line-height: calc(8 / 7);
}
.embedded-collection-startup .collection-startup__summary p:first-child {
    margin-top: 0;
}
.embedded-collection-startup .collection-startup__name {
    color: currentColor;
    display: block;
    text-decoration: none;
}
.embedded-collection-startup .collection-startup__name + br {
    display: none;
}
.embedded-collection-startup .collection-startup__body {
    justify-self: start;
}

.embedded-collection-startup--detailed {
    align-items: start;
}
.embedded-collection-startup--detailed .collection-startup__name {
    font-size: 1.25rem;
    letter-spacing: calc(-0.21 / 20 * 1em);
    line-height: 1.2;
}
.embedded-collection {
    align-items: center;
    display: grid;
    grid-gap: 0.625rem;
    grid-template-columns: var(--icon-size) 1fr min-content;
}

.embedded-collection-meeting,
.embedded-collection-meeting > .collection {
    display: grid;
    grid-auto-flow: column;
    grid-gap: 0.625rem;
}
.embedded-collection-meeting {
    align-items: start;
    grid-auto-columns: var(--icon-size) 1fr 1fr min-content;
}
.embedded-collection-meeting .collection {
    align-items: center;
    display: grid;
    grid-auto-columns: var(--icon-size) 1fr min-content min-content;
    grid-column: 1 / span 4;
}
.embedded-collection-meeting .p-name {
    font-weight: 700;
}
.embedded-collection-meeting .key-attachment {
    --icon-size: 1.875rem;
    flex-grow: 0;
    grid-column: 2;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}
.embedded-collection-meeting .key-attachment a {
    align-items: center;
    display: flex;
    gap: 0.625rem;
    max-width: 100%;
}
.embedded-collection-meeting .key-attachment .file__filename {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.embedded-collection-meeting .remainder {
    align-content: last baseline;
    color: var(--gray-light);
    grid-column: 4;
    justify-self: end;
    line-height: 1.875rem;
    margin: calc(19 / 16 * 1rem + 0.625rem) 0 0; /* FIXME: Find a better solution */
    white-space: nowrap;
}
.embedded-collection-meeting .startup-list {
    --icon-size: 1.875rem;
    grid-column: 3 / span 1;
    overflow: hidden;
}
.embedded-collection-meeting .startup-list p {
    margin: 0.875em 0;
}
.embedded-collection-meeting .startup-list ul {
    display: flex;
    flex-wrap: nowrap;
    gap: 1.25rem;
    list-style: "";
    overflow: hidden;
}
.embedded-collection-meeting .startup-list li {
    align-items: center;
    border-top: none;
    display: flex;
    gap: 0.625rem;
    margin: 0;
    white-space: nowrap;
}
.embedded-collection-meeting .startup-list .is-ocluded {
    visibility: hidden;
}

.embedded-collection-meeting .list-heading {
    font-size: 1rem;
    letter-spacing: calc(-0.17 / 16 * 1em);
    line-height: calc(19 / 16);
    margin: 0 0 0.625rem;
    text-transform: none;
}
.construct-list > .file {
    border-top: solid 2px var(--accent-base);
    display: grid;
    grid-gap: 0.25rem 0.5rem;
    grid-template-areas: "icon category . ."
        "icon name link hamburger"
        "icon meta . .";
    grid-template-columns: 3.75rem 1fr min-content min-content;
    padding: 0.25rem 0 0.75rem;
}
.construct-list .file__filename {
    align-self: center;
    grid-area: name;
    letter-spacing: calc(-0.17 / 16 * 1em);
}
.construct-list .file__icon {
    grid-area: icon;
    margin-top: -0.25rem;
}
.construct-list .file__link {
    align-self: center;
    font-size: 0.875rem;
    font-weight: 700;
    grid-area: link;
    letter-spacing: calc(-0.15 / 14 * 1em);
    text-decoration: none;
    text-transform: uppercase;
}
.construct-list .file__category,
.construct-list .file__meta {
    color: var(--gray-light);
    font-size: 0.75rem;
    letter-spacing: calc(-0.13 / 12 * 1em);
}
.construct .file__meta {
    display: grid;
    grid-gap: 0 1.25rem;
    grid-template-columns: 1fr 1fr 1fr;
}
.construct-list .file popover-toggle {
    grid-area: hamburger;
}
.construct-list .meeting {
    align-items: center;
    border: none;
    display: grid;
    grid-gap: 0.625rem;
    grid-template-areas: "date name action";
    grid-template-columns: var(--icon-size) 1fr 1.25rem;
}

.construct-list .meeting--small {
    --icon-size: 1.875rem;
}

.construct-list .meeting > * {
    grid-row: 1;
}

.construct-list .meeting > .calendar-box {
    grid-area: date;
}
.construct-list .meeting > .p-name {
    grid-area: name;
}
.embedded-partner-org {
    align-items: center;
    display: grid;
    grid-auto-columns: var(--icon-size) 1fr;
    grid-auto-flow: column;
    grid-gap: 0.625rem;
}

.embedded-partner-org .p-name {
    color: var(--gray-dark);
}
.construct-list > .partner-response {
    align-items: center;
    display: grid;
    grid-gap: 0.625rem;
    grid-template-columns: var(--icon-size) 1fr 1.25rem;
}
.embedded-platform {
    display: block; /* We shouldn't need this, but Safari sure thinks we do */
}
.embedded-platform > a {
    align-items: center;
    align-self: start;
    display: grid;
    grid-auto-columns: var(--icon-size) 1fr min-content;
    grid-auto-flow: column;
    grid-gap: 0.625rem;
    text-decoration: none;
}

.embedded-platform .p-name {
    color: var(--gray-dark);
}
.construct-list > .project.h-card {
    align-items: center;
    border-top: solid 1px var(--accent-lighter);
    display: grid;
    grid-auto-columns: 1fr 1.25rem;
    min-height: var(--icon-size);
    padding: 0;
}
.construct-list > .project .p-name,
.construct-list > .project .hint {
    padding: 0.25rem 0;
}
.construct-list > .project .hint {
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: calc(-0.15 / 14 * 1em);
    text-transform: uppercase;
}
.construct-list > .project .p-name {
    color: var(--gray-dark);
}
.construct-list > .project .u-url {
    align-items: center;
    display: grid;
    grid-gap: 0.625rem;
    grid-template-columns: var(--icon-size) 1fr min-content;
    min-height: var(--icon-size);
    text-decoration: none;
}
.construct-list .scouting-priority popover-toggle summary {
    color: var(--accent-base);
}
.construct-list > .scouting-priority .p-name,
.construct-list > .scouting-priority .hint {
    padding: 0.25rem 0;
}
.construct-list > .scouting-priority .p-name {
    color: var(--gray-dark);
}
.construct-list > .scouting-priority .u-url {
    align-items: center;
    display: grid;
    grid-gap: 0.625rem;
    grid-template-columns: var(--icon-size) 1fr min-content;
    min-height: var(--icon-size);
    text-decoration: none;
}
.construct-list .scouting-priority-meta {
    display: grid;
    grid-auto-flow: column;
    grid-column: 2;
    grid-gap: 0.625rem;
    grid-row: 2;
    justify-content: start;
}
.construct-list .scouting-priority-meta > *:empty {
    display: none;
}
.construct-list > .scouting-priority--with-meta .hint,
.construct-list > .scouting-priority--with-meta .u-logo {
    grid-row: 1 / span 2;
}
.embedded-scouting-priority {
    align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: space-between; /* Push items to the ends of the container */

}

.embedded-scouting-priority .scouting-priority__body {
    align-items: center;
    display: grid;
    grid-template-columns: 3rem 10rem 1fr auto auto; /* Number, name, summary (flexible), controls, popover */
    grid-gap: 0.625rem;
}

.embedded-scouting-priority .scouting-priority__name {
    color: currentColor;
    display: block;
    text-decoration: none;
}

.embedded-scouting-priority .scouting-priority__summary {
    color: currentColor;
    display: block;
    text-decoration: none;
    margin-left: 20px;
    width: 80%;
}
.embedded-scouting-priority .scouting-priority__name + br {
    display: none;
}
.embedded-scouting-priority .scouting-priority__body {
    justify-self: start;
}

.embedded-scouting-priority--detailed {
    align-items: start;
}
.embedded-scouting-priority--detailed .scouting-priority__name {
    font-size: 1.25rem;
    letter-spacing: calc(-0.21 / 20 * 1em);
    line-height: 1.2;
}

.scouting-priority__controls {
    display: flex;
    flex-direction: row;
    align-items: center;
    text-decoration: none;
}

.scouting-priority__controls a{
    text-decoration: none;
}
.construct-list .stagegate popover-toggle summary {
    color: var(--accent-base);
}
.construct-list > .stagegate .p-name,
.construct-list > .stagegate .hint {
    padding: 0.25rem 0;
}
.construct-list > .stagegate .p-name {
    color: var(--gray-dark);
}
.construct-list > .stagegate .u-url {
    align-items: center;
    display: grid;
    grid-gap: 0.625rem;
    grid-template-columns: var(--icon-size) 1fr min-content;
    min-height: var(--icon-size);
    text-decoration: none;
}
.construct-list .stagegate-meta {
    display: grid;
    grid-auto-flow: column;
    grid-column: 2;
    grid-gap: 0.625rem;
    grid-row: 2;
    justify-content: start;
}
.construct-list .stagegate-meta > *:empty {
    display: none;
}
.construct-list > .stagegate--with-meta .hint,
.construct-list > .stagegate--with-meta .u-logo {
    grid-row: 1 / span 2;
}
.embedded-stagegate {
    align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: space-between; /* Push items to the ends of the container */

}

.embedded-stagegate .stagegate__name {
    color: currentColor;
    display: block;
    text-decoration: none;
}
.embedded-stagegate .stagegate__name + br {
    display: none;
}
.embedded-stagegate .stagegate__body {
    justify-self: start;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
    min-width: 0;
}

/* Read-only category pill shown on the stagegate row (assignment still happens
   in the 3-dots popover). */
.stagegate__category-badge {
    display: inline-block;
    padding: 0.05rem 0.5rem;
    border-radius: 999px;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    line-height: 1.6;
    white-space: nowrap;
}

.embedded-stagegate--detailed {
    align-items: start;
}
.embedded-stagegate--detailed .stagegate__name {
    font-size: 1.25rem;
    letter-spacing: calc(-0.21 / 20 * 1em);
    line-height: 1.2;
}
.construct-list .startup popover-toggle summary {
    color: var(--accent-base);
}
.construct-list > .startup .p-name,
.construct-list > .startup .hint {
    padding: 0.25rem 0;
}
.construct-list > .startup .p-name {
    color: var(--gray-dark);
}
.construct-list > .startup .u-url {
    align-items: center;
    display: grid;
    grid-gap: 0.625rem;
    grid-template-columns: var(--icon-size) 1fr min-content;
    min-height: var(--icon-size);
    text-decoration: none;
}
.construct-list .startup-meta {
    display: grid;
    grid-auto-flow: column;
    grid-column: 2;
    grid-gap: 0.625rem;
    grid-row: 2;
    justify-content: start;
}
.construct-list .startup-meta > *:empty {
    display: none;
}
.construct-list > .startup--with-meta .hint,
.construct-list > .startup--with-meta .u-logo {
    grid-row: 1 / span 2;
}

.embedded-startup {
    align-items: center;
    display: grid;
    grid-auto-columns: var(--icon-size, 3.75rem) 1fr min-content;
    grid-auto-flow: column;
    grid-gap: 0.625rem;
}
.embedded-startup .startup__summary {
    font-size: 0.875rem;
    letter-spacing: calc(-0.15 / 14 * 1em);
    line-height: calc(8 / 7);
}
.embedded-startup .startup__summary p:first-child {
    margin-top: 0;
}
.embedded-startup .startup__name {
    color: currentColor;
    display: block;
    text-decoration: none;
}
.embedded-startup .startup__name + br {
    display: none;
}
.embedded-startup .startup__body {
    justify-self: start;
}

.embedded-startup .startup__body .p-name::before {
    color: var(--gray-light);
    content: attr(data-pagetype);
    font: normal 0.875rem / 1.15 var(--font-family);
    letter-spacing: calc(-0.15 / 56 * 1em);
}

.embedded-startup--detailed {
    align-items: start;
}
.embedded-startup--detailed .startup__name {
    font-size: 1.25rem;
    letter-spacing: calc(-0.21 / 20 * 1em);
    line-height: 1.2;
}



.startup-icon-with-hover {
    width: 4rem;
}

.startup-icon-with-hover .b-name {
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: calc(-0.15 / 14* 1em);
    line-height: calc(8 / 7);
    text-decoration: none;
    text-transform: uppercase;
    color: var(--accent-darker);
}

.startup-icon-with-hover .b-stats {
    color: var(--gray-dark);
}

.chat-bubble {
    all: unset; /* Removes inherited styles */ !important;
    width: 20px; /* Set your desired width */
    height: 20px; /* Set your desired height */
    display: inline-block; /* Ensures it behaves like an icon */
}
.construct-list > .task {
    align-items: center;
    display: grid;
    grid-gap: 0.625rem;
    grid-template-columns: var(--icon-size) 1fr 1.25rem;
}

.partner_responses_for_task {
    margin: 10px;
    padding-left: 5px;
    border-left: 5px solid var(--accent-darker);
}


.task-attachment {
    display: flex;
    align-items: center; /* Ensures the whole attachment div aligns properly */
}

.task-attachment a {
    display: flex;
    align-items: center; /* Ensures icon and filename are aligned */
}

.task-attachment .file__filename {
    display: flex;
    align-items: center;
}
.embedded-user {
    align-items: center;
    display: grid;
    grid-auto-columns: var(--icon-size) 1fr min-content;
    grid-auto-flow: column;
    grid-gap: 0.625rem;

}
.embedded-user .u-photo {
    border-radius: calc(var(--icon-size) / 2);
}

/* Activity status sits in a min-content grid column — without nowrap it
   wraps at every space into a one-word-wide stack. */
.embedded-user .user-activity {
    white-space: nowrap;
    justify-self: end;
    font-size: 0.8rem;
    color: #888;
}
main[data-controller~="contracts"] {
    display: grid;
    grid-auto-flow: row dense;
    grid-auto-rows: min-content; /* Set the row height to the minimum content height */
    grid-gap: 2.5rem;
    grid-template-columns: 2fr 1fr;
}

.contract-attributes {

}

.status-completed {
    background-color: green;
    color: white;
    padding: 5px;
}

.status-late {
    background-color: red;
    color: white;
    padding: 5px;
}

.status-pending {
    background-color: yellow;
    color: black;
    padding: 5px;
}

.notes-container {
    border: 1px solid #ccc; /* Gray border for the box */
    padding: 10px;
    background-color: #f9f9f9; /* Light background color */
    margin-top: 10px;
}

.notes-placeholder {
    color: #999; /* Gray color for placeholder text */
}
ul {
    margin: 0;
    padding: 0;
}
/* Enhanced Page Header */
.page-header--enhanced {
    /*background: linear-gradient(135deg, #91c4c9 20%, #764ba2 100%);*/
    color: black;
    padding: 2rem;
    border-radius: 12px;
    margin-bottom: 2rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

.page-title {
    font: normal 2.25rem / 1.2 var(--font-family);
    grid-column: 1;
    letter-spacing: calc(-0.15 / 56 * 1em);
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.page-subtitle {
    font-size: 1.1rem;
    margin: 0.5rem 0 0 0;
    opacity: 0.9;
    font-weight: 300;
}

.dashboard-logo {
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.2);
    padding: 0.5rem;
    backdrop-filter: blur(10px);
}

/* Dashboard Layout */
.dashboard-grid {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 2rem;
    align-items: start;
}

.dashboard-sidebar {
    position: sticky;
    top: 2rem;
}

.dashboard-main {
    min-width: 0;
}

/* Stats Section */
.stats-section {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    margin-bottom: 2rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    border: 1px solid #e5e7eb;
}

.stats-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-top: 1rem;
}

.stat-card {
    background: #f8fafc;
    border-radius: 8px;
    padding: 1rem;
    text-align: center;
    border: 1px solid #e2e8f0;
}

.stat-number {
    font-size: 1.75rem;
    font-weight: 700;
    color: #1f2937;
    margin-bottom: 0.25rem;
}

.stat-label {
    font-size: 0.875rem;
    color: #6b7280;
    font-weight: 500;
}

/* Platforms Section */
.platforms-section {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    border: 1px solid #e5e7eb;
}

/* Stagegates Section - Match platforms styling */
.stagegates-section {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    border: 1px solid #e5e7eb;
    margin-top: 2rem;
}

.section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.section-title {
    font-size: 1.25rem;
    font-weight: 600;
    color: #1f2937;
    margin: 0;
}

.platform-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Enhanced Platform List Styling */
.platform-list .construct-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.platform-list .embedded-platform {
    border-top: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 8px;
    border: 1px solid #f3f4f6;
    background: white;
    transition: all 0.2s ease;
}

.platform-list .embedded-platform:hover {
    border-color: #e5e7eb;
    background: #f9fafb;
    transform: translateX(2px);
}

.platform-list .embedded-platform > a {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    text-decoration: none;
    color: inherit;
    min-height: auto;
}

.platform-list .embedded-platform .u-logo {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 6px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    border: 1px solid #e5e7eb;
    object-fit: cover;
    flex-shrink: 0;
}

.platform-list .embedded-platform .p-name {
    color: #374151;
    font-weight: 500;
    font-size: 0.875rem;
    text-align: left;
    margin: 0;
    line-height: 1.25;
}

.platform-list .embedded-platform .hint {
    color: #6b7280;
    font-size: 0.8rem;
    font-weight: 500;
    text-align: right;
    white-space: nowrap;
    background: #f3f4f6;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    border: 1px solid #e5e7eb;
    transition: all 0.2s ease;
}

.platform-list .embedded-platform:hover .hint {
    background: #e5e7eb;
    color: #374151;
    border-color: #d1d5db;
}

.platform-list .embedded-platform:hover .p-name {
    color: #1f2937;
}

/* Enhanced Stagegate List Styling - Match platforms */
.stagegates-section .construct-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.stagegates-section .stagegate {
    border-top: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 8px;
    border: 1px solid #f3f4f6;
    background: white;
    transition: all 0.2s ease;
}

.stagegates-section .stagegate:hover {
    border-color: #e5e7eb;
    background: #f9fafb;
    transform: translateX(2px);
}

.stagegates-section .stagegate > a {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    text-decoration: none;
    color: inherit;
    min-height: auto;
}

.stagegates-section .stagegate .u-logo {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 6px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    border: 1px solid #e5e7eb;
    object-fit: cover;
    flex-shrink: 0;
}

.stagegates-section .stagegate .p-name {
    color: #374151;
    font-weight: 500;
    font-size: 1rem;
    text-align: left;
    margin: 0;
    line-height: 1.25;
    padding: 0.25rem 0 0.25rem 0.5rem;
}

.stagegates-section .stagegate .hint {
    color: #6b7280;
    font-size: 0.8rem;
    font-weight: 500;
    text-align: right;
    white-space: nowrap;
    background: #f3f4f6;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    border: 1px solid #e5e7eb;
    transition: all 0.2s ease;
}

.stagegates-section .stagegate:hover .hint {
    background: #e5e7eb;
    color: #374151;
    border-color: #d1d5db;
}

.stagegates-section .stagegate:hover .p-name {
    color: #1f2937;
}

/* Position stagegate controls on the right */
.stagegates-section .embedded-stagegate {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.stagegate__controls {
    display: flex !important;
    align-items: center;
    gap: 0.5rem;
    flex-direction: row !important;
}

/* Group arrows vertically as a unit */
.stagegate__arrows {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.stagegate__control {
    display: block !important;
    text-decoration: none;
    padding: 0.125rem 0.25rem;
    font-size: 0.75rem;
    line-height: 1;
    text-align: center;
}

/* Stagegate 3-dot menu styling */
.stagegate__menu {
    position: relative;
}

.stagegate__menu-toggle {
    background: none;
    border: none;
    font-size: 1.2rem;
    color: var(--accent-darker);
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 4px;
    transition: all 0.2s ease;
    line-height: 1;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.stagegate__menu-toggle:hover {
    background: #f3f4f6;
    color: #374151;
}

.stagegate__menu-popup {
    position: absolute;
    top: 100%;
    right: 0;
    background: white;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    z-index: 1000;
    min-width: 120px;
    overflow: hidden;
}

.stagegate__menu-popup.hidden {
    display: none;
}

.menu-item {
    padding: 0.5rem 0.75rem;
    cursor: pointer;
    font-size: 0.875rem;
    color: #374151;
    transition: background-color 0.2s ease;
}

.menu-item:hover {
    background: #f9fafb;
}

.menu-item--danger {
    color: #dc2626;
}

.menu-item--danger:hover {
    background: #fef2f2;
}

/* Stagegate Modal Styling */
.stagegate-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.stagegate-modal.hidden {
    display: none;
}

.modal-backdrop {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    cursor: pointer;
}

.modal-content {
    background: white;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
    min-width: 400px;
    max-width: 500px;
    position: relative;
    z-index: 2001;
    max-height: 80vh;
    overflow-y: auto;
}

.modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 1.5rem 0 1.5rem;
    margin-bottom: 1rem;
}

.modal-header h3 {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #374151;
}

.modal-close {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6b7280;
    cursor: pointer;
    padding: 0;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.modal-close:hover {
    background: #f3f4f6;
    color: #374151;
}

.modal-body {
    padding: 0 1.5rem 1.5rem 1.5rem;
}

.modal-body .field {
    margin-bottom: 1rem;
}

.modal-body .field label {
    display: block;
    font-weight: 500;
    margin-bottom: 0.5rem;
    color: #374151;
    font-size: 0.875rem;
}

.modal-body .input {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    font-size: 0.875rem;
    transition: border-color 0.2s ease;
}

.modal-body .input:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.1);
}

.modal-body .actions {
    display: flex;
    gap: 0.5rem;
    justify-content: flex-end;
    margin-top: 1.5rem;
}

.modal-body .warning-text {
    color: #dc2626;
    font-size: 0.875rem;
    margin: 0.5rem 0 1rem 0;
}

.button--danger {
    background: #dc2626;
    border-color: #dc2626;
    color: white;
}

.button--danger:hover {
    background: #b91c1c;
    border-color: #b91c1c;
}

main[data-controller~="dashboards"] {
    padding: 0;
}
main[data-controller~="dashboards"][data-action~="show"] {
    padding: 0;
}



/* Enhanced Tabs */
.enhanced-tabs {
    background: white;
    border-radius: 12px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    border: 1px solid #e5e7eb;
    overflow: hidden;
}

.enhanced-tab-header {
    background: #f8fafc;
    border-bottom: 1px solid #e5e7eb;
    padding: 0;
}

.enhanced-tab-nav {
    display: flex;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.enhanced-tab-nav::-webkit-scrollbar {
    display: none;
}

.enhanced-tab-link {
    background: none;
    border: none;
    padding: 1rem 1.5rem;
    border-bottom: 3px solid transparent;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    white-space: nowrap;
    font-weight: 500;
    color: #6b7280;
    transition: all 0.2s ease;
    min-width: 0;
}

.enhanced-tab-link:hover {
    background: #e5e7eb;
    color: #374151;
}

.enhanced-tab-link.active {
    background: white;
    color: var(--accent-darker);
    border-bottom-color: var(--accent-darker);
    font-weight: 600;
}

.tab-org-name {
    font-size: 0.875rem;
}

.tab-task-count {
    background: #ef4444;
    color: white;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 600;
}

.enhanced-tab-content {
    padding: 0;
}

.enhanced-tab-pane {
    padding: 1.5rem;
}

.enhanced-tab-pane.hidden {
    display: none;
}

/* Section Headers */
.section-header--enhanced {
    background: #f8fafc;
    padding: 1.5rem;
    border-bottom: 1px solid #e5e7eb;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.section-header__content {
    flex: 1;
}

.section-header__actions {
    display: flex;
    gap: 0.75rem;
    flex-shrink: 0;
}

.section-description {
    font-size: 0.875rem;
    color: #6b7280;
    margin: 0.25rem 0 0 0;
}

/* Tasks Section */
.tasks-section {
    margin-bottom: 2rem;
}

/* Collapsible Tasks Section */
.tasks-collapsible {
    background: #fffbeb;
    border: 1px solid #f3f4f6;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 2rem;
}

.tasks-toggle {
    width: 100%;
    background: #fef3c7;
    border: none;
    padding: 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    transition: background-color 0.2s ease;
    border-bottom: 1px solid #f59e0b;
}

.tasks-toggle:hover {
    background: #fde68a;
}

.tasks-right {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.tasks-right::after {
    content: "▼";
    font-size: 0.8rem;
    color: #92400e;
    transition: transform 0.2s ease;
}

.tasks-toggle.collapsed .tasks-right::after {
    transform: rotate(-90deg);
}

.tasks-title {
    font-size: 1rem;
    font-weight: 600;
    color: #92400e;
    margin: 0;
}

.tasks-count {
    font-size: 0.875rem;
    color: #92400e;
    background: #fbbf24;
    padding: 0.25rem 0.5rem;
    border-radius: 12px;
    font-weight: 500;
}

.tasks-content {
    background: white;
    border-top: 1px solid #f3f4f6;
}

.tasks-content.hidden {
    display: none;
}

.tasks-list {
    display: grid;
    gap: 0.75rem;
    padding: 1rem;
}

/* Compact Task Block Styling */
.task__wrapper {
    background: white;
    border: 1px solid darkgray;
    border-radius: 8px;
    padding: 1rem;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    margin: 0 !important;
}

.task__wrapper + .task__wrapper {
    margin-top: 0.75rem !important;
}

.task__header {
    background: #f8fafc;
    margin: -1rem -1rem 1rem -1rem;
    padding: 0.75rem 1rem;
    border-radius: 8px 8px 0 0;
    border-bottom: 1px solid #e5e7eb;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.task__header h3 {
    color: #374151;
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.task__header .timestamp {
    color: #6b7280;
    font-size: 0.875rem;
    margin: 0;
    font-weight: 500;
}

.task__header .timestamp::before {
    content: "•";
    margin-right: 0.25rem;
    color: #9ca3af;
}

/* Compact Task Content */
.task {
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
}

/* Compact Startup Details */
.task .startup-details {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 0.75rem;
}

/* Compact Startup Details in Task Context */
.task .startup-details .embedded-startup--detailed {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.75rem;
    align-items: start;
}

.task .startup-details .u-logo {
    width: 4rem;
    height: 3rem;
    border-radius: 4px;
    object-fit: contain;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
}

.task .startup-details .startup__name {
    font-size: 1rem !important;
    font-weight: 600;
    margin: 0 0 0.25rem 0;
    color: #374151;
    text-decoration: none;
}

.task .startup-details .startup__name:hover {
    color: #1f2937;
    text-decoration: underline;
}

.task .startup-details .startup__summary {
    font-size: 0.875rem;
    color: #6b7280;
    line-height: 1.4;
}

.task .startup-details .startup__summary p {
    margin: 0 0 0.5rem 0;
}

.task .startup-details .startup__summary p:last-child {
    margin-bottom: 0;
}

/* Collapsible Partner Task Section */
.task .partner-task-info {
    background: #fffbeb;
    border: 1px solid #f3f4f6;
    border-radius: 6px;
    overflow: hidden;
}

.partner-task-toggle {
    width: 100%;
    background: #fef3c7;
    border: none;
    padding: 0.5rem 0.75rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 600;
    color: #92400e;
    text-transform: uppercase;
    transition: background-color 0.2s ease;
}

.partner-task-toggle:hover {
    background: #fde68a;
}

.partner-task-toggle::after {
    content: "▼";
    font-size: 0.7rem;
    transition: transform 0.2s ease;
}

.partner-task-toggle.collapsed::after {
    transform: rotate(-90deg);
}

.partner-task-content {
    padding: 0.75rem;
    border-top: 1px solid #f3f4f6;
    background: white;
}

.partner-task-content.hidden {
    display: none;
}

/* Compact Response Form Styling */
.task .seamless-response-form {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 6px;
    padding: 0.75rem;
}

.task .seamless-response-form h4 {
    color: #15803d;
    font-size: 0.875rem;
    font-weight: 600;
    margin: 0 0 0.75rem 0;
    text-transform: uppercase;
}

.task .field {
    margin-bottom: 0.75rem;
}

.task .field label {
    display: block;
    font-weight: 500;
    margin-bottom: 0.25rem;
    color: #374151;
    font-size: 0.875rem;
}

.task .field select,
.task .field textarea,
.task .field input {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    font-size: 0.875rem;
    transition: border-color 0.2s ease;
}

.task .field select:focus,
.task .field textarea:focus,
.task .field input:focus {
    outline: none;
    border-color: #22c55e;
    box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.1);
}

.task .field textarea {
    min-height: 60px;
    resize: vertical;
}

.task .actions {
    margin-top: 0.75rem;
}

.task .actions input[type="submit"] {
    background: #22c55e;
    border: 1px solid #22c55e;
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 4px;
    font-weight: 500;
    font-size: 0.875rem;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.task .actions input[type="submit"]:hover {
    background: #16a34a;
    border-color: #16a34a;
}

/* Compact Task Completed Styling */
.task-completed {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 6px;
    padding: 0.75rem;
}

.completion-badge {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem;
    background: #dcfce7;
    border-radius: 4px;
    margin-bottom: 0.5rem;
}

.completion-icon {
    font-size: 1rem;
}

.completion-text {
    font-weight: 600;
    color: #166534;
    font-size: 0.875rem;
}

.completion-date {
    font-size: 0.75rem;
    color: #16a34a;
    margin-left: auto;
}

.response-content {
    background: white;
    border: 1px solid #d1fae5;
    border-radius: 4px;
    padding: 0.5rem;
    font-size: 0.875rem;
    color: #166534;
}

/* Compact Task Attachments Styling */
.task-attachments {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 0.75rem;
}

.task-attachments h4 {
    color: #374151;
    font-size: 0.875rem;
    font-weight: 600;
    margin: 0 0 0.5rem 0;
    text-transform: uppercase;
}

.attachments {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.25rem;
}

.attachments li {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    padding: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.attachments li::before {
    content: "📄";
    font-size: 0.9rem;
    flex-shrink: 0;
}

.attachments a {
    color: #3b82f6;
    text-decoration: none;
    font-weight: 500;
    font-size: 0.875rem;
    word-break: break-all;
}

.attachments a:hover {
    text-decoration: underline;
}

.no-tasks-message {
    text-align: center;
    padding: 2rem;
    color: #6b7280;
    font-style: italic;
    background: #f9fafb;
    border-radius: 8px;
    border: 1px dashed #d1d5db;
}

/* Pipeline Section */
.startup-pipeline-section {
    margin-top: 2rem;
}

/* Enhanced Table with Integrated Header */
.enhanced-table-container {
    background: white;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    overflow: hidden;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}

.table-header {
    background: #f8fafc;
    border-bottom: 2px solid #e5e7eb;
    padding: 1.25rem 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin: 0;
}

.table-header__content {
    flex: 1;
}

.pipeline-title {
    font-size: 1.125rem;
    font-weight: 600;
    color: #374151;
    margin: 0;
}

.pipeline-subtitle {
    font-size: 0.875rem;
    color: #6b7280;
    margin: 0.25rem 0 0 0;
}

.table-header__actions {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.enhanced-startup-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.enhanced-startup-table thead {
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
}

.enhanced-startup-table th {
    padding: 1rem;
    text-align: left;
    font-weight: 600;
    color: #374151;
    font-size: 0.875rem;
    border-right: 1px solid #f3f4f6;
}

.enhanced-startup-table th:last-child {
    border-right: none;
}

.enhanced-startup-table td {
    padding: 1rem;
    border-bottom: 1px solid #f3f4f6;
    border-right: 1px solid #f9fafb;
    vertical-align: middle;
    color: #4b5563;
}

/* Startup name styling */
.enhanced-startup-table .p-name {
    color: #4F4C4A;
    text-decoration: none;
    font-weight: 600;
    display: block;
    margin-bottom: 0.25rem;
    transition: color 0.2s ease;
}

.enhanced-startup-table .p-name:hover {
    color: #3b82f6;
    text-decoration: none;
}

.enhanced-startup-table td:last-child {
    border-right: none;
}

.enhanced-startup-table tbody tr:hover {
    background: #f9fafb;
}

.enhanced-startup-table tbody tr:last-child td {
    border-bottom: none;
}

/* Column specific styles */
.startup-column {
    width: 20%;
}

.topics-column {
    width: 15%;
}

.status-column {
    width: 12%;
}

.contact-column, .deck-column, .meeting-column {
    width: 8%;
    text-align: center;
}

.notes-column {
    width: 29%;
}

.empty-pipeline-message {
    text-align: center;
    padding: 3rem 2rem;
    color: #6b7280;
    font-style: italic;
    background: #f9fafb;
}

/* Org Tab Container */
.org-tab-container {
    background: white;
}

.org-header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding-bottom: 1.25rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid #e5e7eb;
}

.org-header__logo {
    flex-shrink: 0;
    width: 56px;
    height: 56px;
}

.org-header__logo-img {
    width: 56px;
    height: 56px;
    border-radius: 10px;
    object-fit: contain;
}

.org-header__name {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--text-color, #111827);
    text-decoration: none;
    margin-right: auto;
}

.org-header__link {
    font-size: 1rem;
    font-weight: 600;
    color: var(--accent-darker);
    text-decoration: none;
    white-space: nowrap;
    transition: opacity 0.15s ease;
}

.org-header__link:hover {
    opacity: 0.7;
}

/* Button Styles */
.button {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border-radius: 6px;
    font-weight: 500;
    font-size: 0.875rem;
    text-decoration: none;
    cursor: pointer;
    border: 1px solid;
    transition: all 0.2s ease;
}

.button--primary {
    background: var(--accent-darker);
    border-color: var(--accent-darker);
    color: white;
}

.button--primary:hover {
    background: #43bcc5;
    border-color: #43bcc5;
}

.button--outline {
    background: white;
    border-color: #d1d5db;
    color: #374151;
}

.button--outline:hover {
    background: #f9fafb;
    border-color: #9ca3af;
}

.button--small {
    padding: 0.375rem 0.75rem;
    font-size: 0.8rem;
}

.empty-state {
    text-align: center;
    color: #888;
    font-style: italic;
    padding: 1rem 0;
}

.partners-list__table {
    --icon-size: 2.75rem;
    border-collapse: collapse;
    font-size: 0.75rem;
    font-variant-numeric: tabular-nums;
    letter-spacing: calc(-0.13 / 12 * 1em);
    line-height: calc(5 / 4);
    width: 100%;
}

.partners-list {
 }

.partners-list col.icon {
    width: var(--icon-size);
}
.partners-list .numeric {
    text-align: right;
}
.partners-list a,
.partners-list img {
    display: block;
}
.partners-list a {
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: calc(-0.15 / 14 * 1em);
    line-height: calc(8 / 7);
    text-decoration: none;
    text-transform: uppercase;
}
.partners-list td {
    border-top: solid 1px var(--accent-lighter);
    color: var(--gray-base);
    padding: 0.625rem 0 0.625rem;
    vertical-align: middle;
}
/*.partners-list tr td:first-child {*/
/*    border-top: none;*/
/*}*/

.partners-list th + th,
.partners-list td + td {
    padding-left: 0.625rem;
}
.partners-list th {
    text-align: left;
}

.partners-list .p-name {
    color: var(--gray-dark);
    font-size: 1rem;
    font-weight: 400;
    letter-spacing: calc(-0.17 / 16 * 1em);
    line-height: calc(19 / 16);
    text-transform: none;
}

.partners-list .form__liner {
    min-width: 250px;
    max-width: 500px;
    left: 110px;
    top: -270px;
}
.partners-list input {
    width: 100%;
}
.hidden-headers {
    height: 0;
    padding: 0;
    margin: 0;
    border: none;
    visibility: hidden;
    line-height: 0;
}
.hidden-headers th {
    height: 0;
    padding: 0;
    margin: 0;
    border: none;
    visibility: hidden;
    line-height: 0;
}
.col-contract-name {
    width: 100px;
}

.partners-list .dropdown-content {
    display: none;
}

.partners-list .custom-checkbox{
    width: 25px;
}

.header_buttons {
    align-items: center;
    align-self: center;
    color: var(--accent-darker);
    display: flex;
    font-size: 0.875rem;
    font-weight: 700;
    justify-self: end;
    min-height: 40px;
    min-width: 40px;
    text-decoration: none;
    text-transform: uppercase;
}

.dropdown-btn {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1.5em;
    transform: rotate(0deg);
    transition: transform 0.3s ease;
}

.dropdown-btn.open {
    transform: rotate(90deg);
}

.scout-instructions {
    font-style: italic;
    margin-bottom: 1rem;
}

.platform_topics_container {
    display: grid;
    grid-gap: 2rem 1.25rem;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    justify-content: start;
    margin-top: 2rem;
    scroll-margin-top: 8rem;
}

.startup-icon-list {
    list-style: none; /* Removes bullet points */
    padding: 5px;
    display: grid; /* Use grid layout */
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); /* Responsive columns */
    grid-gap: 1rem; /* Space between grid items */
    border-bottom: solid 1px var(--accent-base);
}

.startup-icon-list .startup-icon-with-hover{
    margin: 5px;
}

.platform_topics_container .b-name {
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--accent-darker);
}

.field--conditional {
    display: none;
}

/* Under Review Section Styling */
.under-review-section {
    margin-bottom: 1.5rem;
}

.under-review-collapsible {
    background: #fff7ed;
    border: 1px solid #fed7aa;
    border-radius: 8px;
    overflow: visible; /* Changed from hidden to visible for popup visibility */
    position: relative;
    z-index: 10;
}

.under-review-toggle {
    width: 100%;
    background: #ffedd5;
    border: none;
    padding: 1rem 1.25rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    transition: background-color 0.2s ease;
    border-bottom: 1px solid #fed7aa;
}

.under-review-toggle:hover {
    background: #fdba74;
}

.under-review-left {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.under-review-left h4 {
    font-size: 1rem;
    font-weight: 600;
    color: #c2410c;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.under-review-count {
    font-size: 0.875rem;
    color: #c2410c;
    background: #fb923c;
    padding: 0.25rem 0.5rem;
    border-radius: 12px;
    font-weight: 600;
}

.under-review-right .toggle-icon {
    font-size: 0.8rem;
    color: #c2410c;
    transition: transform 0.2s ease;
}

.under-review-toggle.collapsed .toggle-icon {
    transform: rotate(-90deg);
}

.under-review-content {
    background: white;
    border-top: 1px solid #fed7aa;
    padding: 1rem;
    max-height: 300px;
    overflow-y: auto;
}

.under-review-content.hidden {
    display: none;
}

/* Grid layout for under review startups */
.under-review-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0.75rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Compact startup cards for under review */
.under-review-startup {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 0.75rem;
    position: relative;
    transition: all 0.2s ease;
    cursor: pointer;
}

.under-review-startup:hover {
    border-color: #fb923c;
    box-shadow: 0 2px 8px rgba(251, 146, 60, 0.15);
    transform: translateY(-2px);
}

.under-review-startup .u-logo {
    width: 100%;
    height: 60px;
    object-fit: cover;
    border-radius: 4px;
    margin-bottom: 0.5rem;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    pointer-events: none;
}

.under-review-startup .startup-name {
    font-size: 0.8rem;
    font-weight: 600;
    color: #374151;
    margin: 0;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 2.1em; /* Ensure consistent height */
    pointer-events: none;
}

/* Popup that escapes container bounds */
.startup-popup {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.startup-popup.hidden {
    display: none;
}

.popup-backdrop {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    cursor: pointer;
}

.popup-content {
    background: white;
    border: 1px solid #d1d5db;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
    padding: 1.5rem;
    min-width: 300px;
    max-width: 400px;
    position: relative;
    z-index: 1001;
    max-height: 80vh;
    overflow-y: auto;
}

.popup-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #e5e7eb;
}

.popup-header h6 {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
}

.popup-close {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #6b7280;
    cursor: pointer;
    padding: 0;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.popup-close:hover {
    background: #f3f4f6;
    color: #374151;
}

/* Approval buttons styling */
.approval-actions {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.approve-btn {
    background: #16a34a;
    color: white;
    border: 1px solid #16a34a;
    padding: 0.375rem 0.75rem;
    border-radius: 4px;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.approve-btn:hover {
    background: #15803d;
    border-color: #15803d;
}

.reject-btn {
    background: #dc2626;
    color: white;
    border: 1px solid #dc2626;
    padding: 0.375rem 0.75rem;
    border-radius: 4px;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.reject-btn:hover {
    background: #b91c1c;
    border-color: #b91c1c;
}

/* Fix for popover-toggle z-index issues */
popover-toggle {
    position: relative;
    z-index: 1050;
}

popover-toggle details[open] {
    z-index: 1050;
}

popover-toggle .details__liner {
    position: absolute;
    z-index: 1051;
    background: white;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

/* Responsive Design */
@media (max-width: 1200px) {
    .dashboard-grid {
        grid-template-columns: 280px 1fr;
        gap: 1.5rem;
    }
    
    .page-title {
        font-size: 1.75rem;
    }
}

@media (max-width: 968px) {
    .dashboard-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .dashboard-sidebar {
        position: static;
        order: 2;
    }
    
    .dashboard-main {
        order: 1;
    }
    
    .page-header--enhanced {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
        padding: 1.5rem;
    }
    
    .section-header--enhanced {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
    }
    
    .section-header__actions {
        flex-direction: column;
        width: 100%;
    }
    
    .enhanced-tab-nav {
        flex-direction: column;
    }
    
    .enhanced-tab-link {
        justify-content: space-between;
        padding: 1rem;
    }
    
    .pipeline-header {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
    }
    
    .pipeline-header__actions {
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .stats-cards {
        grid-template-columns: 1fr;
    }
    
    .page-title {
        font-size: 1.25rem;
    }

    .enhanced-table-container {
        overflow-x: auto;
    }
    
    .enhanced-startup-table {
        min-width: 600px;
    }
    
    .enhanced-startup-table th,
    .enhanced-startup-table td {
        padding: 0.75rem 0.5rem;
        font-size: 0.8rem;
    }
    
    /* Under review grid responsive */
    .under-review-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    /* Task Block Responsive */
    .task__wrapper {
        padding: 0.75rem;
    }
    
    .task__header {
        margin: -0.75rem -0.75rem 0.75rem -0.75rem;
        padding: 0.5rem 0.75rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }
    
    .task__header h3 {
        font-size: 0.875rem;
    }
    
    .task__header .timestamp {
        font-size: 0.8rem;
    }
    
    .task .field select,
    .task .field textarea,
    .task .field input {
        padding: 0.4rem;
        font-size: 0.875rem;
    }
    
    .task .startup-details .embedded-startup--detailed {
        grid-template-columns: auto 1fr;
        gap: 0.5rem;
    }
    
    .task .startup-details .startup__name {
        font-size: 0.875rem !important;
    }
    
    .task .startup-details .startup__summary {
        font-size: 0.8rem;
    }
    
    .completion-badge {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .completion-date {
        margin-left: 0;
    }
    
    /* Platform List Mobile */
    .platform-list .embedded-platform > a {
        padding: 0.6rem;
        gap: 0.6rem;
    }
    
    .platform-list .embedded-platform .u-logo {
        width: 2rem;
        height: 2rem;
    }
    
    .platform-list .embedded-platform .p-name {
        font-size: 0.8rem;
    }
    
    .platform-list .embedded-platform .hint {
        font-size: 0.75rem;
        padding: 0.2rem 0.4rem;
    }
}

@media (max-width: 480px) {
    .under-review-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .startup-popup {
        min-width: 280px;
        max-width: 320px;
    }
}

/* Nested Tabs (Pipeline / Table) */
.nested-tabs {
    background: white;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    overflow: hidden;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}

.nested-tab-header {
    display: flex;
    background: #f8fafc;
    border-bottom: 1px solid #e5e7eb;
    padding: 0;
}

.nested-tab-btn {
    flex: 1;
    background: none;
    border: none;
    padding: 0.875rem 1.5rem;
    font-size: 0.9rem;
    font-weight: 500;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.2s ease;
    border-bottom: 2px solid transparent;
    position: relative;
}

.nested-tab-btn:hover {
    background: #e5e7eb;
    color: #374151;
}

.nested-tab-btn.active {
    background: white;
    color: var(--accent-darker);
    border-bottom-color: var(--accent-darker);
    font-weight: 600;
}

.nested-tab-btn:first-child {
    border-right: 1px solid #e5e7eb;
}

.nested-tab-content {
    padding: 0;
}

.nested-tab-pane {
    padding: 1rem;
}

.nested-tab-pane.hidden,
.nested-tab-pane:not(.active) {
    display: none;
}

/* Adjust pipeline styling within nested tabs */
.nested-tab-pane .pipeline-full-width {
    margin: 0;
}

.nested-tab-pane .enhanced-table-container {
    border: none;
    box-shadow: none;
}

.nested-tab-pane .table-header {
    border-radius: 0;
}

/* Startup Section */
.startup-section {
    margin-top: 2rem;
}

/* Collection sections in startup popup */
.collection-section {
    padding: 0.75rem 0;
}

.collection-section.bordered {
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 0.75rem;
    margin-bottom: 0.75rem;
}

.collection-section-header {
    font-size: 0.75rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 0.5rem;
    padding-bottom: 0.25rem;
    border-bottom: 1px solid #e5e7eb;
}

.collection-divider {
    margin: 0.75rem 0;
    border: 0;
    border-top: 1px dashed #d1d5db;
}

/* Tag styling in popup */
.tag-assignment-section {
    margin-top: 0.5rem;
}

.tag-assignment-section label {
    font-size: 0.75rem;
    font-weight: 600;
    color: #374151;
    display: block;
    margin-bottom: 0.25rem;
}

.assigned-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin-bottom: 0.5rem;
}

.tag-pill {
    display: inline-flex;
    align-items: center;
    background: #e0f2fe;
    color: #0369a1;
    padding: 0.125rem 0.5rem;
    border-radius: 9999px;
    font-size: 0.7rem;
    font-weight: 500;
}

.tag-pill--removable {
    padding-right: 0.25rem;
}

.tag-pill button {
    background: none;
    border: none;
    color: #0369a1;
    font-size: 0.875rem;
    cursor: pointer;
    margin-left: 0.25rem;
    padding: 0 0.125rem;
    line-height: 1;
}

.tag-pill button:hover {
    color: #dc2626;
}

.add-tag-section {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.add-tag-section select {
    flex: 1;
    font-size: 0.75rem;
    padding: 0.25rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
}

.add-tag-section button {
    background: var(--accent-darker);
    color: white;
    border: none;
    width: 24px;
    height: 24px;
    border-radius: 4px;
    font-size: 1rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.add-tag-section button:hover {
    background: #43bcc5;
}

/* Pipeline Drag-and-Drop Styles */
.pipeline-startup-card {
    cursor: grab;
    transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
    position: relative;
}

.pipeline-startup-card:active {
    cursor: grabbing;
}

/* Ghost element (placeholder where item will drop) */
.pipeline-ghost {
    opacity: 0.4;
    background: #e0f2fe !important;
    border: 2px dashed var(--accent-darker) !important;
    border-radius: 8px;
}

/* Currently selected/grabbed item */
.pipeline-chosen {
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    transform: scale(1.02) rotate(1deg);
    z-index: 100;
}

/* Item being dragged */
.pipeline-drag {
    opacity: 0.9;
}

/* Saving state after drop */
.pipeline-saving {
    opacity: 0.6;
    pointer-events: none;
}

.pipeline-saving::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    margin: -10px 0 0 -10px;
    border: 2px solid var(--accent-darker);
    border-top-color: transparent;
    border-radius: 50%;
    animation: pipeline-spin 0.8s linear infinite;
}

@keyframes pipeline-spin {
    to { transform: rotate(360deg); }
}

/* Column highlight when dragging over */
.pipeline-column-content.sortable-chosen-column {
    background: rgba(91, 192, 190, 0.1);
    border: 2px dashed var(--accent-darker);
}

/* Pipeline loading states - show immediately with CSS defaults, JS refines */
/* Set initial column sizing via CSS - provides reasonable layout before JS calculates exact widths */
.pipeline-container.pipeline-loading .pipeline-header,
.pipeline-container.pipeline-loading .pipeline-column-content {
    min-width: 200px;
    flex: 1 1 200px;
}

/* Smooth transition when JS updates the layout */
.pipeline-container.pipeline-ready .pipeline-header,
.pipeline-container.pipeline-ready .pipeline-column-content {
    transition: min-width 0.15s ease, flex 0.15s ease;
}

/* Auto-scroll edge indicators when dragging */
.pipeline-content {
    position: relative;
}

/* Show scroll indicators when dragging is active */
.pipeline-full-width.is-dragging .pipeline-content::before,
.pipeline-full-width.is-dragging .pipeline-content::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 30%;
    pointer-events: none;
    z-index: 50;
    opacity: 0;
    transition: opacity 0.2s ease;
}

/* Left edge gradient */
.pipeline-full-width.is-dragging .pipeline-content::before {
    left: 0;
    background: linear-gradient(to right, rgba(91, 192, 190, 0.3), transparent);
}

/* Right edge gradient */
.pipeline-full-width.is-dragging .pipeline-content::after {
    right: 0;
    background: linear-gradient(to left, rgba(91, 192, 190, 0.3), transparent);
}

/* Show indicators when scrolling in that direction */
.pipeline-full-width.is-dragging.scroll-left .pipeline-content::before,
.pipeline-full-width.is-dragging.scroll-right .pipeline-content::after {
    opacity: 1;
}

/* Pulse animation for active scroll indicators */
@keyframes scroll-pulse {
    0%, 100% { opacity: 0.3; }
    50% { opacity: 0.7; }
}

.pipeline-full-width.is-dragging.scroll-left .pipeline-content::before,
.pipeline-full-width.is-dragging.scroll-right .pipeline-content::after {
    animation: scroll-pulse 0.6s ease-in-out infinite;
}

/* Skeleton Loading Placeholders */
.skeleton-org-tab {
    padding: 1.5rem;
}

.skeleton-header {
    height: 2rem;
    width: 40%;
    background: #e5e7eb;
    border-radius: 6px;
    margin-bottom: 2rem;
    animation: skeleton-pulse 1.5s ease-in-out infinite;
}

.skeleton-pipeline {
    display: flex;
    gap: 1rem;
}

.skeleton-column {
    flex: 1;
    height: 300px;
    background: #f3f4f6;
    border-radius: 8px;
    animation: skeleton-pulse 1.5s ease-in-out infinite;
}

.skeleton-column:nth-child(2) {
    animation-delay: 0.2s;
}

.skeleton-column:nth-child(3) {
    animation-delay: 0.4s;
}

@keyframes skeleton-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* ---- Stagegate Categories manager (partner org page + partner dashboard) ---- */
.sg-categories {
    padding: 0.5rem 0 0;
    /* Query container so the rows below can restack based on the categories
       column's real width, not the viewport. */
    container-type: inline-size;
}
.sg-cat-toggle {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    margin-bottom: 0.85rem;
    cursor: pointer;
}
.sg-cat-toggle__input {
    width: auto;
    flex: 0 0 auto;
}
.sg-cat-list {
    margin: 0 0 0.85rem;
    max-height: 200px;
    overflow-y: auto;
}
.sg-cat-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.sg-cat-color,
.sg-cat-add__color {
    width: 1.6rem;
    height: 1.6rem;
    padding: 0;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: none;
    cursor: pointer;
    flex: 0 0 auto;
}
.sg-cat-name {
    flex: 1 1 auto;
    font-size: 0.9rem;
    color: #1f2937;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.sg-cat-actions {
    display: flex;
    gap: 0.4rem;
    flex: 0 0 auto;
}
.sg-cat-edit,
.sg-cat-delete {
    background: none;
    border: none;
    font-size: 0.78rem;
    cursor: pointer;
    padding: 0.1rem 0.25rem;
}
.sg-cat-edit { color: #02619B; }
.sg-cat-delete { color: #b42318; }
.sg-cat-empty {
    color: #6b7280;
    font-size: 0.85rem;
    font-style: italic;
}
.sg-cat-add {
    display: flex;
    flex-wrap: wrap; /* let the Add button drop to its own line instead of
                        overflowing the box when the column gets narrow */
    gap: 0.5rem;
    align-items: center;
}
.sg-cat-add__name {
    flex: 1 1 100px;
    min-width: 0; /* allow the input to shrink so the row never overflows */
}
.sg-cat-add .button {
    flex: 0 0 auto;
}

/* When the categories column gets narrow, restack each row: color + name on
   the first line (name stays readable), rename/delete on a second line. */
@container (max-width: 215px) {
    .sg-cat-item {
        flex-wrap: wrap;
        row-gap: 0.15rem;
    }
    .sg-cat-name {
        flex: 1 1 auto;
    }
    .sg-cat-actions {
        flex: 0 0 100%;
        justify-content: flex-end;
    }
}

/* Category dropdown inside the stagegate 3-dots popover */
.menu-item--category {
    padding: 0.5rem 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    border-top: 1px solid #f0f0f0;
    cursor: default;
}
.menu-item--category:hover {
    background: transparent;
}
.stagegate-category-label {
    font-size: 0.68rem;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.stagegate-category-select {
    min-width: 150px;
    width: 100%;
    font-size: 0.8rem;
    padding: 0.3rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: #fff;
}
/* ============================================================================
   Design tokens — the site's consolidated visual vocabulary.

   Introduced with the default-platform-page redesign (phase 1). Nothing here
   styles an element; files opt in by consuming the custom properties. Later
   phases (collection page, dashboards, startup pages) adopt the same tokens
   so the whole app converges on one system.

   Direction: "ink + teal" — a dark teal-biased ink for headings/strong text,
   a deep readable teal for everything interactive (the old pale #6fc4cb on
   white failed contrast), the pale brand teals demoted to rules and washes.
   ========================================================================= */

:root {
    /* --- text --- */
    --ink: #22343a;            /* headings, strong text (teal-biased near-black) */
    --text: #313131;           /* body (matches --gray-dark) */
    --text-muted: #5c6169;     /* secondary text, quiet button labels */
    --text-faint: #868d96;     /* meta, hints, empty states */

    /* --- interactive teal (the readability fix) --- */
    --teal-ink: #2f7e86;       /* links, buttons, active tabs */
    --teal-ink-hover: #266b72;

    /* --- brand teals (decoration only: rules, rings, washes) --- */
    /* base.css --accent-* keep their historical roles; these aliases mark the
       demotion: never use them for text or controls in redesigned surfaces. */
    --teal-rule: #b2e0e4;      /* = --accent-base: the signature hairline */
    --teal-ring: #d8eff1;      /* = --accent-lighter: logo rings, hovers */
    --teal-wash: #f6fcfc;      /* = --accent-lightest: tinted grounds */

    /* --- neutrals (ONE ramp; replaces ~14 ad-hoc greys) --- */
    --line: #dee2e6;           /* primary border */
    --line-soft: #e8ebee;      /* dividers, card edges */
    --wash: #f6f7f8;           /* washed backgrounds (heads, feet, tracks) */
    --pill-track: #eef0f2;     /* pill + progress-bar tracks */

    /* --- semantics --- */
    --amber-ink: #c2410c;      /* "needs decision" text */
    --amber-line: #fed7aa;
    --amber-wash: #fff7ed;
    --amber-accent: #f59e0b;   /* stripes, count pills */

    --green-ink: #166534;
    --green-accent: #16a34a;   /* commit/tick actives */
    --green-accent-hover: #15803d;
    --green-wash: #dcfce7;
    --green-line: #86efac;

    --red-ink: #b91c1c;
    --red-wash: #fee2e2;
    --red-line: #fca5a5;

    --blue-ink: #1d4ed8;       /* presence / live-update signals */
    --blue-wash: #eff6ff;
    --blue-line: #bfdbfe;

    /* --- shape --- */
    --radius-ctl: 5px;         /* buttons, inputs, small controls */
    --radius-item: 6px;        /* cards inside lists (review cards, files) */
    --radius-card: 8px;        /* panels, standalone cards */
    --radius-pill: 999px;

    /* --- elevation --- */
    --shadow-card: 0 1px 2px rgba(17, 24, 39, 0.06);
    --shadow-pop: 0 10px 24px rgba(17, 24, 39, 0.14);

    /* --- type --- */
    --font-ui: 'Overpass Var', Overpass, sans-serif;
    --fs-meta: 0.75rem;        /* 12px: chips, counts, fine print */
    --fs-ui: 0.8125rem;        /* 13px: buttons, tabs, controls */
    --fs-body-sm: 0.875rem;    /* 14px */
}

/* Variable Overpass under an ALIAS family, consumed only via --font-ui.
   Deliberately NOT the same family name as the static faces: with statics at
   300/400/700, today's font-weight:600 resolves to the 700 face everywhere —
   a same-family variable face would silently lighten every existing 600
   (FLITE uses them heavily and must stay visually unchanged this phase). */
@font-face {
    font-family: 'Overpass Var';
    src: url(/assets/Overpass_wght_latin-2d260db64997419f862259988f872901d0d43862ba43999e6ed3d9abfee315a1.woff2) format('woff2-variations');
    font-weight: 300 900;
    font-display: swap;
    unicode-range: U+0020-007F, U+00A0-00FF;
}
/* ============================================================
   FLITE brand blue — remap the app's teal accent to the FLITE
   dark blue (the same palette the public proposal form uses) on
   every FLITE surface: the seamless dashboard, the reviewer
   dashboard, the proposal popovers, and the presenter/reviewer
   modes. Scoped to those wrappers so non-FLITE platforms keep the
   teal accent. All var(--accent-*) usages below flip automatically.
   ============================================================ */
.flite-platform,
.flite-reviewer,
.flite-presenter,
.proposal-overlay-wrapper,
.flite-settings,
.flite-modal-overlay,
.page-header--flite {
    --accent-darker:   #02619b; /* primary dark blue (was #6fc4cb) */
    --accent-base:     #72bbdc; /* light blue        (was #b2e0e4) */
    --accent-mid:      #2f85b5; /* the light blue deepened for TEXT use —
                                   #72bbdc itself is too pale to read on white */
    --accent-lighter:  #cfe6f4; /* light tint         (was #d8eff1) */
    --accent-lightest: #eef6fc; /* near-white tint    (was #f6fcfc) */
    --accent-hover:    #024d7c; /* deeper blue for hover / press    */
}

/* .button--primary hover is a hardcoded teal in shared CSS — deepen it to the
   FLITE blue on FLITE surfaces (rest state already flips via --accent-darker). */
.flite-platform .button--primary:hover,
.flite-reviewer .button--primary:hover,
.proposal-overlay-wrapper .button--primary:hover,
.flite-settings .button--primary:hover,
.page-header--flite .button--primary:hover {
    background: var(--accent-hover);
    border-color: var(--accent-hover);
}

/* Header actions (Advance Round / Settings) sit level with the TOP of the
   logo/title instead of dropping to the header's last-baseline row. */
.page-header--flite .actions {
    align-self: start;
}

/* Active-round subtitle stacked under the FLITE program logo/title. */
.page-header--flite .page-header__flite-subline {
    display: block;
    font-size: 0.7rem;
    font-weight: 400;
    color: var(--flite-muted);
    margin-top: 0.125rem;
}
.page-header--flite .page-header__flite-dates {
    display: block;
    font-size: 0.65rem;
    font-weight: 400;
    color: var(--flite-faint);
    margin-top: 0.0625rem;
}
/* Buffer between the active round's date line and the Next Round pair, so the
   two label+date pairs read as separate blocks. */
.page-header--flite .page-header__flite-subline--next {
    margin-top: 0.45rem;
}

/* ============================================================
   FLITE semantic tokens — ONE status palette + ONE gray ramp.
   Declared at :root (NOT inside .flite-platform) because shared
   partials (pipeline CRM cards) also render on non-FLITE pages.
   Every FLITE badge/banner/status color should reference these —
   never a raw hex. Pastel bg + dark fg is the single badge
   language across all surfaces.
   ============================================================ */
:root {
    /* good / active / approved / voted */
    --flite-status-good-bg:      #dcfce7;
    --flite-status-good-fg:      #166534;
    /* warn / pending / saved-for-later / private */
    --flite-status-warn-bg:      #fef3c7;
    --flite-status-warn-fg:      #92400e;
    /* info / under-review / partner-visible — FLITE brand tint */
    --flite-status-info-bg:      #e3f1f9;
    --flite-status-info-fg:      #02619b;
    /* danger / rejected / destructive */
    --flite-status-danger-bg:    #fee2e2;
    --flite-status-danger-fg:    #991b1b;
    /* neutral / round labels / archived */
    --flite-status-neutral-bg:   #f3f4f6;
    --flite-status-neutral-fg:   #6b7280;
    /* completed */
    --flite-status-completed-bg: #e0e7ff;
    --flite-status-completed-fg: #3730a3;

    /* FLITE gray ramp (the Tailwind grays these surfaces already use —
       deliberately distinct from base.css --gray-* which are different hues). */
    --flite-ink:   #1f2937;
    --flite-text:  #374151;
    --flite-muted: #6b7280;
    --flite-faint: #9ca3af;
    --flite-line:  #e5e7eb;
    --flite-wash:  #f9fafb;

    /* Action-feedback text tones (JS status messages, links-as-actions). */
    --flite-ok:  #059669;
    --flite-err: #dc2626;
}

/* Status text for JS-driven inline messages (saving / saved / error). */
.flite-status-text--ok    { color: var(--flite-ok); }
.flite-status-text--err   { color: var(--flite-err); }
.flite-status-text--muted { color: var(--flite-muted); }

/* Right-aligned action cluster inside a section header. */
.flite-header-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Pipeline header variant: two stacked rows of mode buttons. Presenter
   Settings (row 1) sits directly above Presenter Mode (row 2, right-most);
   Download Full PDF + Reviewer Mode fill the bottom row to their left. */
.flite-header-actions--stacked {
    flex-direction: column;
    align-items: flex-end;
    gap: 0.4rem;
}
.flite-header-actions--stacked .flite-actions-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
/* Presenter Settings + Presenter Mode share one width so they align as a
   right-hand stack (the wider label, "Presenter Settings", sets the floor). */
.flite-header-actions--stacked .flite-btn--presenter {
    min-width: 11rem;
}

/* Keep a button_to's generated <form> from forcing its own block line. */
.flite-inline-form {
    display: inline;
}

/* ============================================================
   FLITE unified button — ONE quiet control for every FLITE
   action (dashboard headers, proposal popover, modals). At rest
   it's an uppercase word inside a whisper-hairline outline, so
   buttons sitting side by side stay distinct and never bleed
   together. On hover it fills with its tone — the same "lights
   up into a button" feel as the popover Archive / Edit controls.
   Tone (default blue / warn / danger / muted) lives in the text
   and the hover fill; the resting outline stays neutral.
   ============================================================ */
.flite-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    font-family: inherit;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1.2;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    padding: 0.32rem 0.65rem;
    border: 1px solid var(--flite-line);
    border-radius: 6px;
    background: transparent;
    color: var(--accent-darker);
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.flite-btn:hover {
    background: var(--accent-lightest);
    border-color: var(--accent-base);
    color: var(--accent-darker);
}
.flite-btn:focus-visible {
    outline: 2px solid var(--accent-base);
    outline-offset: 1px;
}
.flite-btn:disabled,
.flite-btn.is-disabled {
    color: var(--flite-faint);
    background: transparent;
    border-color: var(--flite-line);
    opacity: 0.65;
    cursor: not-allowed;
    pointer-events: none;
}

/* When a .flite-btn is an <a> inside a section header (Reviewer/Presenter Mode,
   View Rejected), the global `.section__header a` rule would otherwise force its
   own larger uppercase-link font/tracking — pin the button's own metrics back. */
.section__header a.flite-btn {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1.2;
}

/* Tones — text color at rest, matching tint fill + border on hover. */
.flite-btn--danger { color: var(--flite-status-danger-fg); }
.flite-btn--danger:hover {
    background: var(--flite-status-danger-bg);
    border-color: var(--flite-status-danger-fg);
    color: var(--flite-status-danger-fg);
}
.flite-btn--warn { color: var(--flite-status-warn-fg); }
.flite-btn--warn:hover {
    background: var(--flite-status-warn-bg);
    border-color: var(--flite-status-warn-fg);
    color: var(--flite-status-warn-fg);
}
.flite-btn--muted { color: var(--flite-muted); }
.flite-btn--muted:hover {
    background: var(--flite-wash);
    border-color: var(--flite-faint);
    color: var(--flite-text);
}

/* Solid emphasis — the single commit action in a context (a modal's submit,
   a first-run CTA). Same shape and size; filled so a real commit stands out
   from the quiet ghost buttons around it. */
.flite-btn--solid {
    background: var(--accent-darker);
    border-color: var(--accent-darker);
    color: #fff;
}
.flite-btn--solid:hover {
    background: var(--accent-hover);
    border-color: var(--accent-hover);
    color: #fff;
}
.flite-btn--solid.flite-btn--danger {
    background: var(--flite-status-danger-fg);
    border-color: var(--flite-status-danger-fg);
    color: #fff;
}
.flite-btn--solid.flite-btn--danger:hover {
    background: #7f1d1d;
    border-color: #7f1d1d;
    color: #fff;
}

/* Rails submit_tag / form.submit render <input type="submit">, and the base
   `input[type="submit"]` attribute selector (0,1,1) outguns `.flite-btn`
   (0,1,0) — mirror the button reset at matching specificity so submits look
   identical to button/link .flite-btns. */
input[type="submit"].flite-btn {
    background: transparent;
    border: 1px solid var(--flite-line);
    border-radius: 6px;
    color: var(--accent-darker);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 0.32rem 0.65rem;
}
input[type="submit"].flite-btn:hover {
    background: var(--accent-lightest);
    border-color: var(--accent-base);
    color: var(--accent-darker);
}
input[type="submit"].flite-btn--solid {
    background: var(--accent-darker);
    border-color: var(--accent-darker);
    color: #fff;
}
input[type="submit"].flite-btn--solid:hover {
    background: var(--accent-hover);
    border-color: var(--accent-hover);
    color: #fff;
}
input[type="submit"].flite-btn--danger { color: var(--flite-status-danger-fg); }
input[type="submit"].flite-btn--danger:hover {
    background: var(--flite-status-danger-bg);
    border-color: var(--flite-status-danger-fg);
    color: var(--flite-status-danger-fg);
}
/* Solid danger commit (the Advance-Round modal submit) — without this
   compound, the plain --danger rule painted red TEXT over the --solid
   background. Mirrors .flite-btn--solid.flite-btn--danger. */
input[type="submit"].flite-btn--solid.flite-btn--danger {
    background: var(--flite-status-danger-fg);
    border-color: var(--flite-status-danger-fg);
    color: #fff;
}
input[type="submit"].flite-btn--solid.flite-btn--danger:hover {
    background: #7f1d1d;
    border-color: #7f1d1d;
    color: #fff;
}

/* ============================================
   Post-approval submission alert banner
   New proposals that landed after a startup was
   already approved into the pipeline. Warn-toned.
   ============================================ */
.flite-post-approval-banner {
    background: var(--flite-status-warn-bg);
    border: 1px solid #f59e0b;
    border-radius: 6px;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
}
.flite-post-approval-banner__title {
    color: var(--flite-status-warn-fg);
    font-weight: 700;
}
.flite-post-approval-banner__hint {
    color: var(--flite-status-warn-fg);
    font-size: 0.8125rem;
    margin-top: 0.25rem;
}
.flite-post-approval-banner__list {
    margin: 0.5rem 0 0;
    padding: 0;
    list-style: none;
    color: var(--flite-status-warn-fg);
    font-size: 0.8125rem;
}
.flite-post-approval-banner__item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0.25rem;
    border-top: 1px solid #fde68a;
    cursor: pointer;
}
.flite-post-approval-banner__item-main {
    flex: 1;
}
.flite-post-approval-banner__cue {
    color: var(--flite-status-warn-fg);
    font-size: 0.75rem;
    font-style: italic;
}
.flite-post-approval-banner__more {
    padding: 0.25rem 0;
    font-style: italic;
}
.flite-post-approval-banner__archive.button {
    background: var(--flite-status-warn-fg);
    color: #fff;
    font-size: 0.75rem;
    padding: 0.2rem 0.5rem;
    border: none;
    border-radius: 3px;
}

/* ============================================
   FLITE Platform Page — Layout
   ============================================ */

.flite-platform {
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
    width: 100%;
    grid-column: 1 / -1;
}

/* Override the parent platforms grid forcing sections to column 1 */
.flite-platform section {
    grid-column: auto;
}

/* Sidebar info block */
.flite-sidebar-info {
    font-size: 0.8125rem;
    color: var(--gray-base);
    padding: 0.625rem 0.75rem;
    background: var(--accent-lightest);
    border: 1px solid var(--accent-lighter);
    border-radius: 6px;
    line-height: 1.4;
}

.flite-sidebar-info strong {
    color: var(--gray-dark);
}

/* Inline advance round form in page header */
.flite-advance-inline {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.flite-advance-inline input[type="text"] {
    font-size: 0.8125rem;
    padding: 0.375rem 0.5rem;
    border: 1px solid var(--gray-lighter, #d1d5db);
    border-radius: 4px;
    width: 160px;
}

/* "Go to round" link in repo tabs */
.flite-repo-round-link {
    display: inline-block;
    font-size: 0.8125rem;
    color: var(--accent-darker);
    text-decoration: none;
    margin-bottom: 0.75rem;
}

.flite-repo-round-link:hover {
    text-decoration: underline;
}

/* --- Section empty states --- */
.flite-platform .flite-empty {
    color: var(--gray-light);
    font-size: 0.8125rem;
    padding: 1.25rem 0;
    text-align: center;
    border: 1px dashed var(--gray-lighter);
    border-radius: 6px;
    margin-top: 0.25rem;
}

/* ============================================
   Active Projects & Upcoming Projects
   Compact horizontal scroll strip
   ============================================ */
/* (View-Rejected now uses the unified .flite-btn .flite-btn--danger.) */

/* Under Review + Previously Saved row */
.flite-ur-saved-row {
    display: grid;
    grid-template-columns: 3fr 1fr;
    gap: 1.25rem;
    align-items: start;
}

main[data-controller~="platforms"] .flite-ur-saved-row > section {
    grid-column: auto;
}

.flite-ur-section {
    min-width: 0;
}

.flite-saved-section {
    min-width: 0;
    border-left: 2px solid var(--accent-lighter, #e0e7ff);
    padding-left: 1.25rem;
}

.flite-saved-strip {
    --saved-chip-h: 48px;
    --saved-chip-gap: 0.5rem;
    display: flex;
    flex-direction: column;
    gap: var(--saved-chip-gap);
    min-height: 80px;
    /* Exactly 5 chips visible: 5 chips + 4 gaps + top/bottom padding. */
    max-height: calc((var(--saved-chip-h) * 5) + (var(--saved-chip-gap) * 4) + 0.75rem);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0.375rem 0;
    scrollbar-gutter: stable;
}

.flite-saved-strip .flite-project-chip {
    min-width: 0;
    width: 100%;
    /* min-height (not a fixed height) so a wrapped long name grows the chip
       instead of spilling out its bottom; the strip scrolls to hold overflow. */
    min-height: var(--saved-chip-h);
    flex-shrink: 0;
    box-sizing: border-box;
}

.flite-project-chip--saved {
    border-left: 3px solid var(--accent-base, #72bbdc);
}

.flite-save-ghost {
    opacity: 0.4;
    background: var(--accent-lightest, #eef2ff);
}

.flite-empty--small {
    font-size: 0.75rem;
    color: #9ca3af;
    padding: 1rem;
    text-align: center;
    border: 2px dashed #e5e7eb;
    border-radius: 8px;
    grid-column: 1 / -1;
    /* In a flex-wrap parent (`.flite-project-strip`), force the empty state
       to claim a full row instead of sizing to its text. */
    flex: 1 1 100%;
    width: 100%;
    box-sizing: border-box;
}

@media (max-width: 1024px) {
    .flite-ur-saved-row {
        grid-template-columns: 1fr;
    }
    .flite-saved-section {
        border-left: none;
        border-top: 2px solid var(--accent-lighter, #e0e7ff);
        padding-left: 0;
        padding-top: 1rem;
    }
}

.flite-project-strip {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 0.625rem;
    padding: 0.375rem 0 0.625rem;
    min-height: 40px;
}

.flite-project-strip > .flite-project-chip {
    min-width: 0;
}

.flite-project-strip::-webkit-scrollbar {
    height: 4px;
}

.flite-project-strip::-webkit-scrollbar-thumb {
    background: var(--accent-base);
    border-radius: 2px;
}

.flite-project-chip {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
    /* Uniform floor so every chip is the same height regardless of how much
       metadata (badges/tags) it carries — the logo (36px) + vertical padding
       sets the baseline; content is centered against it. */
    min-height: 3.25rem;
    padding: 0.375rem 0.75rem 0.375rem 0.375rem;
    background: #fff;
    border: 1px solid var(--gray-lighter);
    border-radius: 6px;
    text-decoration: none;
    color: var(--gray-dark);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.flite-project-chip:hover {
    border-color: var(--accent-darker);
    box-shadow: 0 2px 8px rgba(2, 97, 155, 0.15);
    color: var(--gray-dark);
    text-decoration: none;
}

.flite-project-chip__logo {
    width: 36px;
    height: 36px;
    border-radius: 4px;
    object-fit: contain;
    background: var(--gray-lightest);
    flex-shrink: 0;
}

.flite-project-chip__info {
    display: flex;
    flex-direction: column;
    gap: 0.0625rem;
    min-width: 0;
}

.flite-project-chip__startup {
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.25;
    /* One line, ellipsis on overflow (full name in the title tooltip + popover).
       Keeps every chip the same height no matter how long the startup name is. */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    min-width: 0;
}

.flite-project-chip__project {
    font-size: 0.6875rem;
    color: var(--gray-base);
    line-height: 1.2;
    white-space: nowrap;
    /* Reserve one line so a card with no status badge is the same height as one
       that has it — keeps every card in a section uniform. */
    display: block;
    min-height: 0.95rem;
    overflow: hidden;
}

.flite-project-chip__badge {
    display: inline-block;
    font-size: 0.5625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.0625rem 0.3125rem;
    border-radius: 3px;
    line-height: 1.2;
    margin-left: 0.25rem;
    vertical-align: middle;
}

.flite-project-chip__badge--active {
    background: var(--flite-status-good-bg);
    color: var(--flite-status-good-fg);
}

.flite-project-chip__badge--pending {
    background: var(--flite-status-warn-bg);
    color: var(--flite-status-warn-fg);
}

.flite-project-chip__badge--new {
    background: var(--flite-status-info-bg);
    color: var(--flite-status-info-fg);
}

.flite-project-chip__badge--completed {
    background: var(--flite-status-completed-bg);
    color: var(--flite-status-completed-fg);
}

.flite-project-chip__round-badge {
    display: inline-block;
    font-size: 0.5rem;
    font-weight: 600;
    padding: 0.1rem 0.375rem;
    border-radius: 999px;
    background: var(--flite-status-neutral-bg);
    color: var(--flite-status-neutral-fg);
    vertical-align: middle;
    margin-left: 0.25rem;
}

/* Loud flag on an active-project chip: a new proposal arrived for an
   already-approved startup (points the reader at the post-approval banner). */
.flite-project-chip__new-proposal-badge {
    display: inline-block;
    background: var(--flite-status-warn-fg);
    color: #fff;
    font-size: 0.625rem;
    font-weight: 700;
    padding: 0.125rem 0.375rem;
    border-radius: 3px;
    margin-left: 0.25rem;
    vertical-align: middle;
}

/* (The "From: Round X" restored marker is now an inline round badge in the info
   row, rendered after the tags — see _flite_under_review_chip.) */

/* Repo mode — cards fill grid cells instead of being inline chips */
.flite-project-chip--repo {
    min-width: 0;
    width: 100%;
    align-items: flex-start;
}

/* ============================================
   FLITE Pipeline — match cards to chip style
   ============================================ */
.flite-platform .pipeline-column-content .startup {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    min-height: auto;
    min-width: 0;
    /* Columns grow to share the board width, but the card stays a uniform
       chip size (centered in its column) — matching the other sections'
       chips no matter how many stagegate columns are visible. */
    width: 100%;
    max-width: 300px;
    justify-self: center;
    padding: 0.375rem 0.75rem 0.375rem 0.375rem;
    gap: 0.5rem;
    border-radius: 6px;
    box-shadow: none;
    border: 1px solid var(--gray-lighter);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.flite-platform .pipeline-column-content .startup:hover {
    transform: none;
    border-color: var(--accent-darker);
    box-shadow: 0 2px 8px rgba(2, 97, 155, 0.15);
}

/* Card link wrapper — horizontal layout matching chip */
.flite-platform .pipeline-column-content .startup-card-link {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-align: left;
    flex: 1;
    min-width: 0;
    overflow: hidden;
}

.flite-platform .pipeline-column-content .startup-card-link:hover {
    transform: none;
}

.flite-platform .pipeline-column-content .startup .u-logo {
    width: 36px;
    height: 36px;
    margin: 0;
    border-radius: 4px;
    object-fit: contain;
    background: var(--gray-lightest);
    flex-shrink: 0;
    display: block;
}

.flite-platform .pipeline-column-content .startup .startup__body {
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 0.0625rem;
    min-width: 0;
    width: auto;
    justify-self: start;
    padding-right: 1.5rem;
}

.flite-platform .pipeline-column-content .startup .startup__name {
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.25;
    text-align: left;
    margin: 0;
    padding: 0;
    /* Match the strip chip: one line, ellipsis (full name in the popover). */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.flite-platform .pipeline-column-content .startup .startup__subtopic {
    font-size: 0.6875rem;
    text-align: left;
    color: var(--gray-base);
}

.flite-platform .pipeline-column-content .startup .startup__approval-comment {
    font-size: 0.6875rem;
}

.flite-platform .pipeline-column-content .startup .startup__tags {
    margin-top: 0.125rem;
}

/* ============================================
   FLITE Reviewer
   ============================================ */

/* Progress bar */
.flite-reviewer__progress {
    margin-bottom: 1.25rem;
    padding: 0.75rem 1rem;
    background: var(--flite-wash);
    border: 1px solid var(--flite-line);
    border-radius: 8px;
}

.flite-reviewer__progress-text {
    font-size: 0.8125rem;
    color: var(--flite-text);
    display: block;
    margin-bottom: 0.5rem;
}

.flite-reviewer__progress-bar {
    height: 6px;
    background: var(--flite-line);
    border-radius: 3px;
    overflow: hidden;
}

.flite-reviewer__progress-fill {
    height: 100%;
    background: var(--accent-darker);
    border-radius: 3px;
    transition: width 0.3s ease;
}

/* Chip vote badges */
.flite-reviewer__vote-badge {
    display: inline-block;
    font-size: 0.5625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.0625rem 0.3125rem;
    border-radius: 3px;
    margin-left: 0.25rem;
}

.flite-reviewer__vote-badge--complete {
    background: var(--flite-status-good-bg);
    color: var(--flite-status-good-fg);
}

.flite-reviewer__vote-badge--none {
    background: var(--flite-status-danger-bg);
    color: var(--flite-status-danger-fg);
}

/* Completed chip */
.flite-reviewer__chip--complete {
    border-color: #a7f3d0;
    background: #f0fdf4;
}

/* Reviewer dialog — add row for nav header */
.flite-reviewer__dialog {
    grid-template-rows: auto 1fr;
}

.flite-reviewer__dialog .proposal-overlay__startup {
    border-radius: 0 0 0 12px;
}

.flite-reviewer__dialog .proposal-overlay__content {
    border-radius: 0 0 12px 0;
}

/* Navigation header — spans full width across both columns */
.flite-reviewer__nav-header {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
    border-radius: 12px 12px 0 0;
    flex-shrink: 0;
}

.flite-reviewer__nav-arrow {
    background: none;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    cursor: pointer;
    color: #374151;
    transition: all 0.15s;
    flex-shrink: 0;
}

.flite-reviewer__nav-arrow:hover {
    background: #f3f4f6;
    border-color: #9ca3af;
}

.flite-reviewer__nav-info {
    text-align: center;
    font-size: 0.875rem;
    color: #1f2937;
    min-width: 0;
}

.flite-reviewer__nav-progress {
    display: block;
    font-size: 0.7rem;
    color: #6b7280;
    margin-top: 0.125rem;
}

/* Vote section in popover */
.flite-reviewer__vote-section {
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 2px solid var(--accent-lighter, #e0e7ff);
}

.flite-reviewer__vote-section--top {
    margin-top: 0;
    padding: 1rem;
    background: #fefce8;
    border: 1px solid #fde68a;
    border-radius: 8px;
    margin-bottom: 1rem;
    border-top: none;
}

.flite-reviewer__vote-section h4 {
    margin: 0 0 0.75rem;
    font-size: 0.875rem;
    color: #374151;
}

/* Vote form */
.flite-vote-form__current {
    padding: 0.75rem;
    background: #f0f9ff;
    border-radius: 6px;
    margin-bottom: 0.5rem;
}

.flite-vote-form__current-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: #374151;
    display: block;
    margin-bottom: 0.25rem;
}

.flite-vote-form__current-comment {
    font-size: 0.8rem;
    color: #6b7280;
    font-style: italic;
    margin: 0.25rem 0 0.5rem;
}

.flite-vote-form__stars {
    display: flex;
    gap: 0.25rem;
    margin-bottom: 0.5rem;
}

.flite-vote-form__stars--display {
    margin-bottom: 0.25rem;
}

.flite-vote-form__star {
    font-size: 1.25rem;
    color: #d1d5db;
    line-height: 1;
}

.flite-vote-form__star--filled {
    color: #f59e0b;
}

.flite-vote-form__star-btn {
    background: none;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 0.375rem 0.625rem;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.125rem;
    transition: all 0.15s;
}

.flite-vote-form__star-btn:hover {
    background: #fffbeb;
    border-color: #f59e0b;
}

.flite-vote-form__star-btn--selected {
    background: #fffbeb;
    border-color: #f59e0b;
}

.flite-vote-form__star-btn--selected .flite-vote-form__star {
    color: #f59e0b;
}

.flite-vote-form__star-label {
    font-size: 0.625rem;
    color: #6b7280;
}

.flite-vote-form__comment {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 0.8rem;
    resize: vertical;
    margin-bottom: 0.5rem;
}

.flite-vote-form__actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* (Submit button now uses .flite-btn .flite-btn--solid for its sizing.) */

.flite-vote-form__status {
    font-size: 0.75rem;
}

.flite-vote-form__edit-btn {
    margin-top: 0.5rem;
}

/* ============================================
   Round Card Layout (Project Viewer)
   Quiet shell: neutral border + colored 3px left accent stripe.
   Sealed history rounds collapse to a one-line header.
   Inner sections are flat (no nested cards) — subtle dividers only.
   ============================================ */
.round-card {
    border: 1px solid #e5e7eb;
    border-left: 3px solid #d1d5db;
    border-radius: 6px;
    margin-bottom: 0.625rem;
    background: #ffffff;
    overflow: hidden;
}

.round-card--active    { border-left-color: #10b981; }
.round-card--pending   { border-left-color: #f59e0b; }
.round-card--review    { border-left-color: var(--accent-base, #72bbdc); }
.round-card--saved     { border-left-color: #fb923c; }
.round-card--completed { border-left-color: #3b82f6; }
.round-card--archived  { border-left-color: #9ca3af; }

.round-card__header {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    padding: 0.5rem 0.75rem;
    background: #fff;
}

.round-card__header-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.round-card__header--collapsible {
    cursor: pointer;
    transition: background 0.1s;
}

/* "Add proposal" button pinned to the right of the round header row. */
.round-card__header-action {
    margin-left: auto;
    flex-shrink: 0;
}

.round-card__header--collapsible:hover {
    background: #f9fafb;
}

.round-card__context {
    font-size: 0.7rem;
    color: #6b7280;
    line-height: 1.35;
    padding-left: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    align-items: baseline;
}

.round-card--sealed .round-card__context {
    color: #9ca3af;
}

.round-card__context-entry {
    color: #4b5563;
}

.round-card__context-sep {
    color: #d1d5db;
}

.round-card__context-outcome {
    color: #6b7280;
    font-style: italic;
}

.round-card--archived .round-card__context-outcome {
    color: #b91c1c;
    font-style: normal;
}

.round-card__name {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #1f2937;
}

.round-card__badge {
    font-size: 0.625rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.15rem 0.45rem;
    border-radius: 999px;
}

/* Unified pastel status ramp (was solid saturated fills — visually loud and a
   second badge language next to the chips' pastels). */
.round-card__badge--active    { background: var(--flite-status-good-bg);      color: var(--flite-status-good-fg); }
.round-card__badge--pending   { background: var(--flite-status-warn-bg);      color: var(--flite-status-warn-fg); }
.round-card__badge--completed { background: var(--flite-status-completed-bg); color: var(--flite-status-completed-fg); }
.round-card__badge--saved     { background: var(--flite-status-warn-bg);      color: var(--flite-status-warn-fg); }
.round-card__badge--review    { background: var(--flite-status-info-bg);      color: var(--flite-status-info-fg); }
.round-card__badge--archived  { background: var(--flite-status-neutral-bg);   color: var(--flite-status-neutral-fg); }

.round-card__summary {
    font-size: 0.75rem;
    color: #6b7280;
    margin-left: 0.25rem;
}

.round-card__save-indicator {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    font-size: 0.6875rem;
    color: #b45309;
    background: #fff7ed;
    padding: 0.15rem 0.4rem;
    border-radius: 4px;
    cursor: help;
}

.round-card__save-indicator-count {
    font-weight: 600;
}

.round-card__body {
    padding: 0.5rem 0.75rem 0.625rem;
    border-top: 1px solid #f3f4f6;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.round-card__chevron {
    font-size: 0.6rem;
    color: #9ca3af;
    flex-shrink: 0;
    width: 11px;
    text-align: center;
}

/* --- Project section (still its own collapsible block) --- */
.round-card__section {
    border: 1px solid #f3f4f6;
    border-radius: 5px;
    background: #fff;
    overflow: hidden;
}

.round-card__section-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.625rem;
    cursor: pointer;
    transition: background 0.1s;
}

.round-card__section-header:hover {
    background: #f9fafb;
}

.round-card__section-title {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #1f2937;
}

.round-card__section-meta {
    font-size: 0.6875rem;
    color: #9ca3af;
    margin-left: auto;
}

.round-card__section-content {
    padding: 0.625rem 0.75rem;
    border-top: 1px solid #f3f4f6;
}

/* --- Combined proposals section (flat — no nested card per proposal) --- */
.round-card__proposals {
    display: flex;
    flex-direction: column;
}

.round-card__proposals > .round-card__proposal-row:not(:first-child) {
    border-top: 1px solid #f3f4f6;
}

.round-card__proposal-row {
    background: #fff;
}

.round-card__proposal-row--primary {
    background: #fffaf0;
    border-radius: 4px;
    margin-bottom: 0.25rem;
    border-top: none !important;
}

.round-card__proposal-row--archived {
    opacity: 0.75;
}

.round-card__proposal-row-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.625rem;
    cursor: pointer;
    transition: background 0.1s;
}

.round-card__proposal-row-header:hover {
    background: #f9fafb;
}

.round-card__primary-marker {
    color: #f59e0b;
    font-size: 0.875rem;
    flex-shrink: 0;
    width: 11px;
    text-align: center;
}

.round-card__proposal-row-title {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #1f2937;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
}

.round-card__proposal-row-short-title {
    font-weight: 500;
    color: #6b7280;
    font-style: italic;
}

.round-card__proposal-row-meta {
    font-size: 0.6875rem;
    color: var(--flite-faint);
    margin-left: auto;
    text-align: right;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    line-height: 1.35;
    flex-shrink: 0;
    max-width: 55%;
}
.round-card__proposal-row-submitter {
    color: var(--flite-text);
    font-weight: 600;
}
.round-card__proposal-row-subline {
    word-break: break-word;
}

.round-card__proposal-row-content {
    padding: 0.25rem 0.625rem 0.625rem;
}

.round-card__proposal-row--primary .round-card__proposal-row-content {
    padding-top: 0.25rem;
}

/* --- Archived fold (Gmail-style "+ N archived" disclosure) --- */
.round-card__archived-fold {
    border-top: 1px dashed #e5e7eb;
    margin-top: 0.25rem;
}

.round-card__archived-fold-header {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.625rem;
    cursor: pointer;
    color: #6b7280;
    font-size: 0.75rem;
    transition: background 0.1s;
}

.round-card__archived-fold-header:hover {
    background: #f9fafb;
    color: #374151;
}

.round-card__archived-fold-label {
    font-weight: 500;
}

.round-card__archived-fold-content > .round-card__proposal-row {
    border-top: 1px solid #f3f4f6;
}

/* --- Inline badges within proposal titles --- */
.round-card__carried-badge {
    font-size: 0.6rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 0.1rem 0.35rem;
    border-radius: 3px;
    background: var(--flite-status-info-bg);
    color: var(--flite-status-info-fg);
}

.round-card__empty {
    font-size: 0.8125rem;
    color: #9ca3af;
    font-style: italic;
    padding: 0.25rem 0.25rem 0;
    margin: 0;
}

/* --- Compress proposal content spacing when inline in a round row --- */
.round-card__proposal-row-content .proposal-overlay__archived-banner,
.round-card__proposal-row-content .proposal-overlay__meta {
    margin-bottom: 0.6rem;
}

.round-card__proposal-row-content .proposal-overlay__tags {
    margin-bottom: 0.6rem;
}

.round-card__proposal-row-content .proposal-overlay__votes--top {
    margin-bottom: 0.6rem;
    padding: 0.5rem 0.625rem;
}

.round-card__proposal-row-content .proposal-overlay__fields {
    margin-bottom: 0.6rem;
}

.round-card__proposal-row-content .proposal-overlay__field {
    margin-bottom: 0.75rem;
}

.round-card__proposal-row-content .proposal-overlay__actions {
    padding: 0.5rem 0;
    margin-bottom: 0;
}

.round-card__proposal-row-content .project-viewer__proposal-primary-bar {
    margin-bottom: 0.5rem;
}

/* ============================================
   Archived Proposal Styles
   ============================================ */
.proposal-overlay__tab--archived {
    opacity: 0.6;
    font-style: italic;
    font-size: 0.7rem;
}

.proposal-overlay__tab-divider {
    font-size: 0.6rem;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.25rem 0.5rem;
    align-self: center;
    border-left: 1px solid #e5e7eb;
    margin-left: 0.25rem;
}

.proposal-overlay__archived-banner {
    padding: 0.5rem 0.75rem;
    background: #fef3c7;
    border: 1px solid #fde68a;
    border-radius: 6px;
    font-size: 0.8rem;
    color: #92400e;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* ============================================
   Advance Round Modal
   ============================================ */
.flite-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    /* Above the global `popover-toggle { z-index: 1050 }` (dashboards.css) —
       at 1000 the Under Review "Add" button painted through the modal. */
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.flite-modal {
    background: #fff;
    border-radius: 0.75rem;
    padding: 1.5rem;
    max-width: 500px;
    width: 90%;
    max-height: 80vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

.flite-modal h3 {
    margin: 0 0 0.25rem;
    font-size: 1.125rem;
}

.flite-modal__subtitle {
    color: var(--flite-muted);
    font-size: 0.8rem;
    margin: 0 0 1rem;
}

/* Round summary box at the top of the Advance-Round modal. */
.flite-modal__info {
    font-size: 0.8rem;
    color: var(--flite-text);
    margin-bottom: 0.75rem;
    padding: 0.5rem;
    background: var(--flite-wash);
    border-radius: 4px;
}

.flite-modal__input {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    margin-bottom: 1rem;
    font-size: 0.875rem;
}

.flite-modal__project-list {
    max-height: 300px;
    overflow-y: auto;
    border: 1px solid #e5e7eb;
    border-radius: 0.375rem;
    padding: 0.5rem;
    margin-bottom: 1rem;
}

.flite-modal__project-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.25rem;
    border-bottom: 1px solid #f3f4f6;
    cursor: pointer;
    font-size: 0.8rem;
}

.flite-modal__project-item:last-child {
    border-bottom: none;
}

.flite-modal__project-item input[type="checkbox"] {
    flex-shrink: 0;
}

.flite-modal__empty {
    color: #9ca3af;
    font-size: 0.8rem;
    text-align: center;
    padding: 1rem 0;
}

.flite-modal__actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 0.5rem;
}

/* ============================================
   Under Review — Grid
   ============================================ */
.flite-review-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 0.625rem;
    padding: 0.375rem 0;
}

@media (max-width: 1200px) {
    .flite-review-grid { grid-template-columns: repeat(5, 1fr); }
}
@media (max-width: 900px) {
    .flite-review-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 600px) {
    .flite-review-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 400px) {
    .flite-review-grid { grid-template-columns: 1fr; }
}

/* ============================================
   Under Review — Card
   ============================================ */
.flite-review-card {
    aspect-ratio: 1;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--gray-lighter, #ccc);
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
    color: var(--gray-dark);
    cursor: pointer;
    overflow: hidden;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.flite-review-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
    border-color: var(--accent-base);
}

/* --- Card header: logo + name --- */
.flite-review-card__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.5rem 0.5rem 0;
    flex-shrink: 0;
}

.flite-review-card__logo {
    width: 72px;
    height: 72px;
    border-radius: 6px;
    object-fit: contain;
    background: var(--gray-lightest, #fafafa);
    box-shadow: inset 0 0 0 1px var(--accent-lighter);
    flex-shrink: 0;
}

.flite-review-card__name {
    font-size: 0.875rem;
    font-weight: 600;
    text-align: center;
    line-height: 1.3;
    margin-top: 0.375rem;
    word-break: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* --- Card body: proposals / badge area --- */
.flite-review-card__body {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: 0.25rem 0.5rem 0.5rem;
    flex-shrink: 0;
}

/* Single-proposal status badge */
.flite-review-card__status {
    display: inline-block;
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.1875rem 0.5rem;
    border-radius: 10px;
    background: var(--accent-lightest);
    color: var(--accent-darker);
    border: 1px solid var(--accent-base);
}

/* Tags row — evenly spaced */
.flite-review-card__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    justify-content: space-evenly;
    margin-top: 0.3125rem;
    width: 100%;
}

/* ============================================
   Multi-Proposal — Columns with pill + tags
   ============================================ */
.flite-review-card__proposal-columns {
    display: flex;
    justify-content: space-evenly;
    width: 100%;
    gap: 0.25rem;
}

.flite-review-card__proposal-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    flex: 1;
    min-width: 0;
}

.flite-review-card__pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    font-size: 0.6875rem;
    font-weight: 700;
    border-radius: 50%;
    background: var(--accent-lightest);
    color: var(--accent-darker);
    border: 1px solid var(--accent-base);
    flex-shrink: 0;
}

.flite-review-card__pill--hidden {
    background: #fef3c7;
    color: #92400e;
    border-color: #fde68a;
    opacity: 0.55;
    text-decoration: line-through;
}

/* Tags inside a proposal column */
.flite-review-card__proposal-col .flite-review-card__tags {
    margin-top: 0;
    justify-content: center;
}

/* Hidden status badge for single proposals */
.flite-review-card__status--hidden {
    background: #fef3c7;
    color: #92400e;
    border-color: #fde68a;
    opacity: 0.7;
}

/* ============================================
   Project Repository
   Card grid with vertical scroll
   ============================================ */
.flite-repo-grid {
    display: grid;
    /* Same track sizing as .flite-project-strip so repository cards read as the
       same compact chip as every other section, not wide full-row bars. */
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 0.625rem;
    max-height: 26rem;
    overflow-y: auto;
    padding: 0.375rem 0.25rem 0.375rem 0;
    scrollbar-width: thin;
    scrollbar-color: var(--accent-base) transparent;
}

.flite-repo-grid::-webkit-scrollbar {
    width: 4px;
}

.flite-repo-grid::-webkit-scrollbar-thumb {
    background: var(--accent-base);
    border-radius: 2px;
}

.flite-repo-card {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    padding: 0.75rem;
    background: #fff;
    border: 1px solid var(--gray-lighter);
    border-radius: 6px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.flite-repo-card:hover {
    border-color: var(--accent-base);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.flite-repo-card__logo {
    width: 40px;
    height: 40px;
    border-radius: 4px;
    object-fit: contain;
    background: var(--gray-lightest);
    flex-shrink: 0;
}

.flite-repo-card__body {
    min-width: 0;
    flex: 1;
}

.flite-repo-card__startup {
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 0.0625rem;
}

.flite-repo-card__startup a {
    color: var(--gray-dark);
    text-decoration: none;
}

.flite-repo-card__startup a:hover {
    color: var(--accent-darker);
}

.flite-repo-card__project {
    font-size: 0.75rem;
    color: var(--gray-base);
    margin-bottom: 0.125rem;
}

.flite-repo-card__project a {
    color: var(--gray-base);
    text-decoration: none;
}

.flite-repo-card__project a:hover {
    color: var(--accent-darker);
}

.flite-repo-card__meta {
    font-size: 0.6875rem;
    color: var(--gray-light);
}

/* (repo grid now uses auto-fill minmax like .flite-project-strip — it reflows
   to fewer columns on narrow viewports on its own, no breakpoints needed.) */

/* ============================================
   Tabs override for repository
   Remove max-width constraints
   ============================================ */
.flite-platform .tabs,
.flite-platform .tabs--wide,
.flite-reviewer .tabs,
.flite-reviewer .tabs--wide {
    max-width: 100%;
    width: 100%;
    min-width: 0;
}

/* The reviewer dashboard isn't wrapped by `.flite-platform`, which means it
   doesn't escape the platforms-page grid (`main[data-controller~="platforms"]`
   is `grid-template-columns: 2fr 1fr`). Span both columns so the reviewer
   gets the full main width, mirroring the seamless `.flite-platform` rule.
   Cap to that full width and let `.tab-nav`'s `overflow-x: auto` handle the
   round-tabs horizontal scroll. */
.flite-reviewer {
    grid-column: 1 / -1;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: hidden;
}

/* ============================================
   Section count badge in headers
   ============================================ */
.flite-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.6875rem;
    font-weight: 700;
    min-width: 1.25rem;
    height: 1.25rem;
    padding: 0 0.3125rem;
    border-radius: 10px;
    background: var(--accent-lightest);
    color: var(--accent-darker);
    border: 1px solid var(--accent-base);
    margin-left: 0.25rem;
    vertical-align: middle;
    line-height: 1;
    /* 'Overpass Badge' (fonts.css) is Overpass with corrected vertical metrics —
       plain Overpass renders digits visibly high in this tight box. Zeroed
       letter-spacing undoes the h2's negative tracking (nudges the digit left). */
    font-family: 'Overpass Badge', var(--font-family);
    letter-spacing: 0;
}

/* ============================================
   Round label in section headers
   ============================================ */
a.flite-round-label,
.flite-round-label {
    font-size: 0.8125rem;
    font-weight: 400;
    color: var(--gray-light);
    text-transform: none;
    margin-left: 0.375rem;
    text-decoration: none;
}

a.flite-round-label:hover {
    color: var(--accent-darker);
    text-decoration: underline;
}

/* ============================================
   Read-only FLITE entries on the seamless dashboard /
   org pages (aggregated per-round cards + table rows).
   Round badge shares the neutral round-label language.
   ============================================ */
.flite-round-badge {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 600;
    background: var(--flite-status-neutral-bg);
    color: var(--flite-status-neutral-fg);
    border-radius: 999px;
    padding: 0.1rem 0.5rem;
    margin-top: 0.25rem;
    vertical-align: middle;
}
.flite-entry-card {
    cursor: pointer;
}
.flite-entry-card__link {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.25rem;
}
.flite-entry-row__cell-stack {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* ============================================
   Proposal Overlay — Fullscreen modal
   ============================================ */

/* Wrapper appended to body — must sit above header and all other layers */
.proposal-overlay-wrapper {
    position: fixed;
    inset: 0;
    z-index: 9999999;
}

.proposal-overlay {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Backdrop — click to close */
.proposal-overlay__backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1;
    cursor: pointer;
}

/* The dialog box */
.proposal-overlay__dialog {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 280px 1fr;
    width: calc(100vw - 200px);
    height: calc(100vh - 80px);
    max-width: 1400px;
    margin: 40px auto;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    overflow: visible;
}

/* --- Startup Info Sidebar --- */
.proposal-overlay__startup {
    display: flex;
    flex-direction: column;
    padding: 1.75rem 1.5rem;
    background: var(--gray-lightest, #f9fafb);
    border-right: 1px solid var(--gray-lighter, #e5e7eb);
    overflow-y: auto;
    border-radius: 12px 0 0 12px;
}

.proposal-overlay__startup-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 1.5rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--gray-lighter, #e5e7eb);
}

.proposal-overlay__logo {
    width: 80px;
    height: 80px;
    border-radius: 8px;
    object-fit: contain;
    background: #fff;
    border: 1px solid var(--gray-lighter, #e5e7eb);
    margin-bottom: 0.75rem;
}

.proposal-overlay__startup-name {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--gray-dark, #1f2937);
    margin: 0;
    line-height: 1.3;
}

.proposal-overlay__short-title {
    font-size: 0.95rem;
    font-style: italic;
    font-weight: 500;
    color: var(--accent-darker, #02619b);
    line-height: 1.3;
    margin: 0.25rem 0 0;
}

/* Definition list for startup details */
.proposal-overlay__details {
    margin: 0;
    padding: 0;
    flex: 1;
}

.proposal-overlay__details dt {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--gray-light, #6b7280);
    margin-bottom: 0.125rem;
}

.proposal-overlay__details dd {
    font-size: 0.8125rem;
    color: var(--gray-dark, #1f2937);
    margin: 0 0 1rem;
    line-height: 1.5;
    word-break: break-word;
}

.proposal-overlay__details dd a {
    color: var(--accent-darker);
    text-decoration: none;
}

.proposal-overlay__details dd a:hover {
    text-decoration: underline;
}

.proposal-overlay__contact-email {
    font-size: 0.75rem;
    color: var(--gray-light, #6b7280);
}

/* Full-width .flite-btn under the sidebar identity block. */
.proposal-overlay__profile-link {
    margin-top: 0.75rem;
    width: 100%;
}

/* --- Review Section --- */
.proposal-overlay__review {
    margin-top: auto;
    padding-top: 1rem;
    border-top: 1px solid var(--gray-lighter, #e5e7eb);
}

.proposal-overlay__review-heading {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--gray-dark, #1f2937);
    margin: 0 0 0.5rem;
}

.proposal-overlay__review-actions {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.proposal-overlay__review-actions .button--approve {
    flex: 1;
    background: #059669;
    color: #fff;
    border: none;
    padding: 0.4rem 0.75rem;
    border-radius: 4px;
    font-size: 0.8rem;
    cursor: pointer;
}

.proposal-overlay__review-actions .button--approve:hover {
    background: #047857;
}

.proposal-overlay__review-actions .button--reject {
    flex: 1;
    background: #dc2626;
    color: #fff;
    border: none;
    padding: 0.4rem 0.75rem;
    border-radius: 4px;
    font-size: 0.8rem;
    cursor: pointer;
}

.proposal-overlay__review-actions .button--reject:hover {
    background: #b91c1c;
}

.proposal-overlay__review-status {
    display: block;
    margin-top: 0.375rem;
    font-size: 0.75rem;
}

/* --- Project Viewer --- */
.project-viewer__meta {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 1.25rem;
}

/* Unified status ramp (was a foreign Bootstrap-alert palette). */
.project-viewer__status--pending { background: var(--flite-status-warn-bg); color: var(--flite-status-warn-fg); }
.project-viewer__status--active { background: var(--flite-status-good-bg); color: var(--flite-status-good-fg); }
.project-viewer__status--completed { background: var(--flite-status-completed-bg); color: var(--flite-status-completed-fg); }

.project-viewer__round {
    font-size: 0.8rem;
    color: var(--gray-mid, #6b7280);
    background: var(--gray-lightest, #f3f4f6);
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
}

.project-viewer__date {
    font-size: 0.8rem;
    color: var(--gray-mid, #6b7280);
}

.project-viewer__detail-field {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    margin-bottom: 0.6rem;
    max-width: 260px;
}

.project-viewer__detail-field label {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--gray-base, #6b7280);
}

.project-viewer__detail-field input {
    font-size: 0.85rem;
    padding: 0.4rem 0.5rem;
    border: 1px solid var(--accent-base, #72bbdc);
    border-radius: 4px;
    font-family: inherit;
}

.project-viewer__section {
    margin-bottom: 1.25rem;
}

.project-viewer__section h4 {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--gray-dark, #1f2937);
    margin: 0 0 0.5rem;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid var(--gray-lighter, #e5e7eb);
}

.project-viewer__section p {
    font-size: 0.85rem;
    color: var(--gray-dark, #374151);
    margin: 0;
}

/* Project images */
.project-viewer__images {
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
}

.project-viewer__image-item {
    border: 1px solid var(--gray-lighter, #e5e7eb);
    border-radius: 6px;
    overflow: hidden;
}

.project-viewer__image {
    display: block;
    max-width: 100%;
    max-height: 400px;
    object-fit: contain;
}

/* Compact inline sibling of .flite-btn — the borderless "Edit" toggles that sit
   next to a project-detail heading. No resting outline (each is alone beside its
   label, so there's nothing to bleed into); still lights up on hover. */
.project-viewer__edit-btn {
    background: none;
    border: none;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--accent-darker);
    cursor: pointer;
    padding: 0.15rem 0.4rem;
    margin-left: 0.375rem;
    border-radius: 4px;
    vertical-align: middle;
    transition: background 0.15s ease;
}

.project-viewer__edit-btn:hover {
    background: var(--accent-lightest, #f0fdfa);
}

.project-viewer__edit-btn:disabled {
    opacity: 0.5;
    cursor: default;
}

.project-viewer__notes-input {
    width: 100%;
    min-height: 80px;
    font-size: 0.85rem;
    padding: 0.5rem;
    border: 1px solid var(--gray-lighter, #d1d5db);
    border-radius: 4px;
    resize: vertical;
    font-family: inherit;
}

.project-viewer__notes-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.375rem;
}

.project-viewer__notes-status {
    font-size: 0.75rem;
    display: block;
    margin-top: 0.25rem;
}

.project-viewer__proposal-status {
    margin-left: 0.5rem;
    font-size: 0.8rem;
}

.project-viewer__partners {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.project-viewer__partner-badge {
    font-size: 0.75rem;
    padding: 0.2rem 0.5rem;
    background: var(--accent-light, #e0f2fe);
    color: var(--accent-dark, #0369a1);
    border-radius: 4px;
}

.project-viewer__files {
    list-style: none;
    padding: 0;
    margin: 0;
}

.project-viewer__file {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0;
    border-bottom: 1px solid var(--gray-lighter, #f3f4f6);
    font-size: 0.8rem;
}

.project-viewer__file-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.project-viewer__file-name {
    flex: 1;
    color: var(--gray-dark, #374151);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-viewer__file-type {
    font-size: 0.7rem;
    color: var(--gray-mid, #6b7280);
    background: var(--gray-lightest, #f3f4f6);
    padding: 0.1rem 0.35rem;
    border-radius: 3px;
}

.project-viewer__file-link {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--accent-darker);
    text-decoration: none;
    text-transform: uppercase;
    padding: 0.125rem 0.375rem;
    border-radius: 3px;
    flex-shrink: 0;
    transition: background 0.15s ease;
}

.project-viewer__file-link:hover {
    background: var(--accent-lightest, #f0fdfa);
}

.project-viewer__file-delete {
    background: none;
    border: none;
    color: var(--gray-light, #9ca3af);
    cursor: pointer;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    padding: 0.125rem 0.375rem;
    border-radius: 3px;
    flex-shrink: 0;
    transition: color 0.15s ease, background 0.15s ease;
}

.project-viewer__file-delete:hover {
    color: #dc2626;
    background: #fef2f2;
}

.project-viewer__empty {
    font-size: 0.8rem;
    color: var(--gray-mid, #6b7280);
    margin: 0 0 0.75rem;
}

.project-viewer__upload {
    margin-top: 0.5rem;
}

.project-viewer__upload-row {
    display: flex;
    gap: 0.375rem;
    align-items: center;
    max-width: 90%;
}

.project-viewer__file-input {
    flex: 1;
    font-size: 0.75rem;
    min-width: 0;
}

.project-viewer__type-select {
    font-size: 0.75rem;
    padding: 0.25rem 0.375rem;
    border: 1px solid var(--gray-lighter, #d1d5db);
    border-radius: 4px;
    min-width: 130px;
}

.project-viewer__upload-status {
    display: block;
    margin-top: 0.25rem;
    font-size: 0.75rem;
}

/* Text-style tabs (for Project/Proposal toggle) — same sizing, labels fit naturally */
.proposal-overlay__tabs--text button {
    font-size: 0.75rem;
}

/* Make project chips clickable */
.flite-project-chip {
    cursor: pointer;
}

.flite-repo-card {
    cursor: pointer;
}

/* --- Proposal Content Area --- */
.proposal-overlay__content {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    border-radius: 0 12px 12px 0;
}

.proposal-overlay__panel {
    display: flex;
    flex-direction: column;
    min-height: 0;
    flex: 1;
}

.proposal-overlay__content-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.75rem;
    border-bottom: 1px solid var(--gray-lighter, #e5e7eb);
    flex-shrink: 0;
}

.proposal-overlay__content-header h2 {
    font-size: 1.125rem;
    font-weight: 700;
    margin: 0;
    color: var(--gray-dark, #1f2937);
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.project-viewer__header-actions {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-shrink: 0;
}

.project-viewer__proposal-select {
    font-size: 0.7rem;
    padding: 0.2rem 0.375rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    margin-left: auto;
    color: #374151;
}

.project-viewer__proposal-primary-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 0;
    margin-bottom: 0.5rem;
    border-bottom: 1px solid #e5e7eb;
}

.project-viewer__primary-badge {
    font-size: 0.75rem;
    font-weight: 600;
    color: #b45309;
    background: #fef3c7;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
}

.project-viewer__proposal-round {
    font-size: 0.7rem;
    color: #6b7280;
}

.proposal-overlay__tab--primary {
    font-weight: 700;
}

/* Tab buttons — hang off right edge of dialog, connected flush */
.proposal-overlay__tabs {
    display: flex;
    flex-direction: column;
    gap: 0;
    position: absolute;
    right: 0;
    top: 4.25rem;
    transform: translateX(100%);
    z-index: 3;
}

.proposal-overlay__tabs button {
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--accent-base);
    border-left: none;
    border-radius: 0 6px 6px 0;
    background: #fff;
    color: var(--accent-darker);
    font-size: 0.75rem;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s ease, color 0.15s ease;
    white-space: nowrap;
    box-shadow: 4px 2px 8px rgba(0, 0, 0, 0.08);
}

.proposal-overlay__tabs button + button {
    border-top: none;
}

.proposal-overlay__tabs button:hover {
    background: var(--accent-lightest);
}

.proposal-overlay__tabs button.active {
    background: var(--accent-darker);
    color: #fff;
    border-color: var(--accent-darker);
}

/* Hidden proposal tab — strikethrough number + muted style */
.proposal-overlay__tab--hidden {
    opacity: 0.45;
    text-decoration: line-through;
    border-style: dashed;
}

.proposal-overlay__tab--hidden.active {
    opacity: 0.65;
    text-decoration: line-through;
}

/* Hidden badge in proposal meta row */
.proposal-overlay__hidden-badge {
    display: inline-block;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.25rem 0.625rem;
    border-radius: 10px;
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fde68a;
}

/* Spacer pushes hide button to the right in meta row */
.proposal-overlay__meta-spacer {
    flex: 1;
}


.proposal-overlay__hidden-warning svg {
    flex-shrink: 0;
}

/* Archive button (seamless-initiated, user-archived lifecycle) */
/* Tools strip: tag pills + "+ Add tag" on the left, Archive/Delete actions
   right-aligned on the same row. No "Tags" label — the pills speak for
   themselves and the add-affordance is labelled "+ Add tag". */
.proposal-overlay__tools {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 1.1rem;
}

.proposal-overlay__tools > .proposal-overlay__tags {
    flex: 1 1 auto;
    min-width: 0;
    margin-bottom: 0;
}

.proposal-overlay__eyebrow {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--flite-muted);
}

.proposal-overlay__tools-actions {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex-shrink: 0;
}

.proposal-overlay__action-form {
    display: inline;
    margin: 0;
}

.proposal-overlay__tags-empty {
    font-size: 0.75rem;
    font-style: italic;
    color: var(--flite-faint);
}

/* (Archive / Delete now use the unified .flite-btn .flite-btn--warn / --danger.) */

/* Archive-source indicator in the meta row (system vs user) */
.proposal-overlay__archive-source {
    display: inline-block;
    font-size: 0.625rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    background: #f3f4f6;
    color: #6b7280;
}

.proposal-overlay__archive-source--user {
    background: #fee2e2;
    color: #991b1b;
}

.proposal-overlay__archive-source--system {
    background: #e0f2fe;
    color: #075985;
}

/* Scrollable proposal body */
.proposal-overlay__scroll {
    flex: 1;
    overflow-y: auto;
    padding: 1.75rem;
    scrollbar-width: thin;
    scrollbar-color: var(--accent-base) transparent;
}

.proposal-overlay__scroll::-webkit-scrollbar {
    width: 6px;
}

.proposal-overlay__scroll::-webkit-scrollbar-thumb {
    background: var(--accent-base);
    border-radius: 3px;
}

.proposal-overlay__no-proposal {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: var(--gray-mid, #6b7280);
    font-size: 0.95rem;
}

/* Proposal metadata row */
.proposal-overlay__meta {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

/* Actions-only variant (submitter identity moved to the row header): keep the
   Archive/Delete buttons compact and right-aligned. */
.proposal-overlay__meta--actions {
    justify-content: flex-end;
    margin-bottom: 1rem;
}

.proposal-overlay__status-badge {
    display: inline-block;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.25rem 0.625rem;
    border-radius: 10px;
    background: var(--accent-lightest);
    color: var(--accent-darker);
    border: 1px solid var(--accent-base);
}

.proposal-overlay__submitted {
    font-size: 0.8125rem;
    color: var(--gray-light, #6b7280);
    display: inline-flex;
    align-items: baseline;
    gap: 0.4rem;
}

.proposal-overlay__submitted strong {
    color: var(--gray-dark, #1f2937);
}

.proposal-overlay__submitter-email {
    font-size: 0.75rem;
    color: #9ca3af;
}

.proposal-overlay__archived-banner-label {
    font-weight: 600;
    color: #92400e;
}

/* Proposal fields (key/value pairs) */
.proposal-overlay__fields {
    /* Breathing room between the Notes box above and the tab bar. */
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

/* Highlights / More Details tabs inside a proposal popover. Own namespace so it
   never collides with the viewer's .proposal-overlay__tabs proposal-switcher
   (which is absolutely positioned off the dialog edge). Active state is driven
   by aria-selected (set by the shared presenter-tabs Stimulus controller). */
.flite-body-tabs__nav {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid var(--gray-lightest, #e5e7eb);
}

/* "Edit proposal" toggle: right-aligned in the tab bar so it clearly acts on the
   answers below, not the notes above. (Bare-header variant when there are no
   tabs.) */
.flite-body-tabs__edit {
    margin-left: auto;
    align-self: center;
    margin-bottom: 0.35rem;
}

.flite-body-tabs__bare-header {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 0.75rem;
}

.flite-body-tabs__tab {
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    padding: 0.5rem 0;
    font-family: inherit;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--gray-base, #6b7280);
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease;
}

.flite-body-tabs__tab:hover {
    color: var(--gray-dark, #111827);
}

.flite-body-tabs__tab[aria-selected="true"] {
    color: var(--gray-dark, #111827);
    border-bottom-color: var(--accent-base, #72bbdc);
}

.flite-body-tabs__panel[hidden] {
    display: none;
}

/* --- Proposal "Slide" tab: a presentation one-pager composed from the
   platform's assigned slide slots + the startup's company facts. --- */
.flite-slide {
    padding: 1.25rem 1.5rem 1.5rem;
    color: #374151;
    font-size: 0.9rem;
    line-height: 1.5;
}
.flite-slide__header {
    border-bottom: 2px solid var(--accent-lighter);
    padding-bottom: 0.6rem;
    margin-bottom: 1rem;
}
.flite-slide__title {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--accent-darker);
    line-height: 1.2;
    /* base.css sets h1–h6 to uppercase; the slide title is mixed-case. */
    text-transform: none;
}
.flite-slide__sep {
    color: var(--accent-base);
    font-weight: 400;
    margin: 0 0.4rem;
}
.flite-slide__project {
    font-style: italic;
    font-weight: 700;
}
.flite-slide__lead {
    color: #4b5563;
    margin-bottom: 0.85rem;
    font-size: 0.875rem;
}
.flite-slide__lead-tag {
    font-weight: 700;
    color: var(--accent-darker);
}
.flite-slide__prose {
    margin: 0 0 0.4rem;
}
.flite-slide__prose:last-child,
.flite-slide__lead p:last-child,
.flite-slide__item-body p:last-child {
    margin-bottom: 0;
}
/* simple_format wraps answers in <p>, whose default browser margin opened a
   blank line between a label and its text. Keep paragraphs tight on the slide. */
.flite-slide p {
    margin: 0 0 0.35rem;
}
.flite-slide p:last-child {
    margin-bottom: 0;
}

.flite-slide__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem 2rem;
    margin-top: 0.25rem;
}
.flite-slide__col {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
}
.flite-slide__item {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
}
.flite-slide__icon {
    flex: 0 0 auto;
}
.flite-slide__icon-img {
    width: 2.25rem;
    height: 2.25rem;
    display: block;
    /* Custom PNG icons keep their aspect ratio inside the fixed box. */
    object-fit: contain;
}
.flite-slide__item-body {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 0.85rem;
    padding-top: 0.2rem;
}
.flite-slide__facts {
    margin: 0;
}
.flite-slide__fact {
    display: flex;
    gap: 0.4rem;
    margin-bottom: 0.2rem;
}
.flite-slide__fact dt {
    font-weight: 700;
    color: var(--accent-darker);
    min-width: 5.25rem;
    flex: 0 0 auto;
}
.flite-slide__fact dd {
    margin: 0;
}
.flite-slide__figure {
    margin-bottom: 0.3rem;
}
.flite-slide__figure:last-child {
    margin-bottom: 0;
}
.flite-slide__figure + .flite-slide__figure {
    margin-top: 0.5rem;
}
.flite-slide__figure-label {
    display: block;
    font-weight: 700;
    color: var(--accent-darker);
    margin-bottom: 0.15rem;
}
.flite-slide__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 1.25rem;
    padding-top: 0.85rem;
    border-top: 1px solid var(--accent-lighter);
}

/* --- Slide media: proposal file uploads shown inline below the content.
   Images click through to the fullscreen attachment viewer; videos play in
   place; PDF decks embed the browser's viewer for in-place paging. --- */
.flite-slide__media {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid var(--accent-lighter);
}

/* Each media item spans the full available width, like the embedded deck. */
.flite-slide__media-grid {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.flite-slide__media-item {
    display: block;
    width: 100%;
    border: 1px solid var(--flite-line);
    border-radius: 8px;
    background: var(--flite-wash);
    overflow: hidden;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.flite-slide__media-item:hover {
    border-color: var(--accent-base);
    box-shadow: 0 2px 8px rgba(2, 97, 155, 0.15);
}

.flite-slide__media-img {
    display: block;
    width: 100%;
    max-height: 480px;
    object-fit: contain;
}

.flite-slide__media-video {
    display: block;
    width: 100%;
    max-height: 480px;
    border: 1px solid var(--flite-line);
    border-radius: 8px;
    background: #000;
}

.flite-slide__deck {
    border: 1px solid var(--flite-line);
    border-radius: 8px;
    overflow: hidden;
}

.flite-slide__deck-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.45rem 0.75rem;
    background: var(--flite-wash);
    border-bottom: 1px solid var(--flite-line);
}

.flite-slide__deck-name {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--flite-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.flite-slide__deck-expand {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--accent-darker);
    text-decoration: none;
    flex-shrink: 0;
}

.flite-slide__deck-expand:hover { text-decoration: underline; }

.flite-slide__deck-frame {
    display: block;
    width: 100%;
    height: 34rem;
    border: none;
    background: #fff;
}

/* Linked media (YouTube / Vimeo / Loom / Drive / Dropbox / LinkedIn) — same
   full-width card chrome as the deck, with a 16:9 player frame. */
.flite-slide__embed {
    border: 1px solid var(--flite-line);
    border-radius: 8px;
    overflow: hidden;
}

.flite-slide__embed-frame {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    border: none;
    background: #000;
}

/* Post-style embeds (LinkedIn) are portrait-ish — a 16:9 frame crops them.
   Match the deck frame's height instead; the post scrolls inside if longer. */
.flite-slide__embed-frame--tall {
    aspect-ratio: auto;
    height: 34rem;
    background: #fff;
}

@media (max-width: 640px) {
    .flite-slide__grid {
        grid-template-columns: 1fr;
    }
}

/* --- Slide trim editor: seamless-only stacked overrides for the Slide view
   (metadata['slide_trims']). Each field shows the full original muted and
   read-only above the trimmed-text textarea, for reference while shortening. */
.flite-slide-trim__bar {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

/* .flite-btn's display:inline-flex would override the UA [hidden] rule —
   restate it so the bar's Save button actually hides until the editor opens. */
.flite-btn[hidden] {
    display: none;
}

.flite-slide-trim {
    border: 1px solid var(--accent-lighter);
    border-radius: 6px;
    padding: 0.85rem;
    margin-bottom: 1rem;
    font-size: 0.85rem;
}

.flite-slide-trim__hint {
    color: #6b7280;
    margin: 0 0 0.75rem;
}

.flite-slide-trim__field {
    margin-bottom: 0.85rem;
}

.flite-slide-trim__label {
    display: block;
    font-weight: 700;
    color: var(--accent-darker);
    margin-bottom: 0.15rem;
}

.flite-slide-trim__original {
    color: #6b7280;
    white-space: pre-wrap;
    margin-bottom: 0.3rem;
    padding-left: 0.5rem;
    border-left: 2px solid var(--accent-lighter);
}

.flite-slide-trim__input {
    width: 100%;
    font: inherit;
    color: var(--flite-text);
    border: 1px solid var(--accent-mid);
    border-radius: 4px;
    padding: 0.4rem;
}

.flite-slide-trim__actions {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.proposal-overlay__section-heading {
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--accent-darker, #02619b);
    margin: 1.5rem 0 0.75rem;
    padding-bottom: 0.375rem;
    border-bottom: 1px solid var(--gray-lightest, #e5e7eb);
}

.proposal-overlay__section:first-of-type .proposal-overlay__section-heading {
    margin-top: 0;
}

/* Collapsible section heading in the popover */
.proposal-overlay__section-heading--toggle {
    cursor: pointer;
    user-select: none;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.proposal-overlay__section-chevron {
    font-size: 0.7rem;
    color: var(--gray-base, #9ca3af);
}

.proposal-overlay__field {
    margin-bottom: 1.25rem;
}

/* Question labels are full sentences — sentence case, in the mid brand blue
   (the light blue deepened for text legibility) so they pair with the dark-blue
   section headings while the answer text stays ink. */
.proposal-overlay__field dt {
    font-size: 0.8125rem;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    color: var(--accent-mid, #2f85b5);
    margin-bottom: 0.25rem;
}

.proposal-overlay__field dd {
    font-size: 0.875rem;
    color: var(--gray-dark, #1f2937);
    margin: 0;
    line-height: 1.6;
}

.proposal-overlay__field dd p {
    margin: 0 0 0.5rem;
}

.proposal-overlay__field dd p:last-child {
    margin-bottom: 0;
}

.proposal-overlay__field--short-title {
    background: #f0f9ff;
    border-left: 3px solid var(--accent-darker, #02619b);
    padding: 0.625rem 0.75rem;
    border-radius: 4px;
    margin-bottom: 1.25rem;
}

.proposal-overlay__field--short-title dd {
    font-size: 1rem;
    font-weight: 600;
    color: var(--accent-darker, #02619b);
}

.proposal-overlay__field-empty {
    color: #9ca3af;
    font-style: italic;
    font-weight: 400;
}

/* Action buttons row */
.proposal-overlay__actions {
    display: flex;
    gap: 0.5rem;
    padding: 1rem 0;
    border-top: 1px solid var(--gray-lighter, #e5e7eb);
    border-bottom: 1px solid var(--gray-lighter, #e5e7eb);
    margin-bottom: 1.5rem;
}

/* Votes section */
.proposal-overlay__votes {
    margin-top: 0.5rem;
}

.proposal-overlay__votes--top {
    margin-top: 0;
    margin-bottom: 1rem;
    padding: 0.75rem;
    background: #f0f9ff;
    border: 1px solid #bae6fd;
    border-radius: 8px;
}

.proposal-overlay__votes h4 {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--gray-dark, #1f2937);
    margin: 0 0 0.75rem;
}

.proposal-overlay__vote {
    padding: 0.625rem 0.75rem;
    margin-bottom: 0.5rem;
    border-left: 3px solid var(--accent-base);
    background: var(--gray-lightest, #f9fafb);
    border-radius: 0 4px 4px 0;
    font-size: 0.8125rem;
}

.proposal-overlay__vote p {
    margin: 0.25rem 0 0;
    color: var(--gray-base, #4b5563);
}

.proposal-overlay__vote-remove {
    float: right;
    margin-left: 0.5rem;
    padding: 0 0.25rem;
    border: none;
    background: none;
    color: var(--gray-base, #9ca3af);
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
    border-radius: 4px;
}

.proposal-overlay__vote-remove:hover {
    color: #dc2626;
    background: #fee2e2;
}

/* --- Responsive --- */
@media (max-width: 768px) {
    .proposal-overlay__dialog {
        grid-template-columns: 1fr;
        width: calc(100vw - 32px);
        height: calc(100vh - 32px);
        margin: 16px auto;
        overflow: hidden;
    }

    .proposal-overlay__tabs {
        position: static;
        transform: none;
        flex-direction: row;
    }

    .proposal-overlay__tabs button {
        border-left: 1px solid var(--accent-base);
        border-radius: 6px;
    }

    .proposal-overlay__startup {
        max-height: 200px;
        border-right: none;
        border-bottom: 1px solid var(--gray-lighter, #e5e7eb);
        border-radius: 12px 12px 0 0;
    }

    .proposal-overlay__content {
        border-radius: 0 0 12px 12px;
    }

    .proposal-overlay__startup-header {
        flex-direction: row;
        gap: 0.75rem;
        text-align: left;
    }

    .proposal-overlay__logo {
        width: 48px;
        height: 48px;
        margin-bottom: 0;
    }
}


/* ============================================
   Question Editor — Settings page
   ============================================ */
.flite-questions-editor {
    margin-bottom: 2rem;
    padding: 1rem;
    border: 1px solid var(--gray-lighter, #e5e7eb);
    border-radius: 8px;
    background: #fff;
}

.flite-question-row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 1.1rem 0;
    /* Clear divider between questions so a Yes/No + follow-up + Highlights-label
       stack doesn't blur into the next question. */
    border-bottom: 1px solid #e5e7eb;
    transition: background 0.1s ease;
}

.flite-question-row__options-line {
    flex-basis: 100%;
    width: 100%;
    margin-top: 0.25rem;
    padding-left: 1.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

/* Highlights-label line — a short display label for Core questions. Matches the
   options-line layout; toggled with the Core checkbox. */
.flite-question-row__abbrev-line {
    flex-basis: 100%;
    width: 100%;
    margin-top: 0.25rem;
    padding-left: 1.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.flite-question-row__abbrev-hint {
    font-weight: 400;
    color: var(--gray-light, #9ca3af);
}

.flite-question-row__abbrev-input {
    max-width: 24rem;
    font-size: 0.8125rem;
    padding: 0.375rem 0.5rem;
    border: 1px solid var(--gray-lighter, #d1d5db);
    border-radius: 4px;
    font-family: inherit;
}

.flite-question-row__abbrev-input:focus {
    outline: none;
    border-color: var(--accent-base, #72bbdc);
    box-shadow: 0 0 0 2px rgba(2, 97, 155, 0.15);
}

.flite-question-row__options-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--gray-base, #6b7280);
}

.flite-question-row__options-input {
    width: 100%;
    font-size: 0.8125rem;
    padding: 0.375rem 0.5rem;
    border: 1px solid var(--gray-lighter, #d1d5db);
    border-radius: 4px;
    font-family: inherit;
    resize: vertical;
}

.flite-question-row__follow-up-line {
    flex-basis: 100%;
    width: 100%;
    margin-top: 0.25rem;
    padding-left: 1.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.flite-question-row__follow-up-toggle {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--gray-base, #6b7280);
    display: flex;
    align-items: center;
    gap: 0.375rem;
    cursor: pointer;
}

.flite-question-row__follow-up-fields {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.flite-question-row__follow-up-label {
    flex: 1;
    min-width: 200px;
    font-size: 0.8125rem;
    padding: 0.375rem 0.5rem;
    border: 1px solid var(--gray-lighter, #d1d5db);
    border-radius: 4px;
}

.flite-question-row__follow-up-type {
    width: 130px;
    font-size: 0.8125rem;
    padding: 0.375rem 0.5rem;
    border: 1px solid var(--gray-lighter, #d1d5db);
    border-radius: 4px;
}

.flite-question-row__follow-up-trigger {
    font-size: 0.75rem;
    color: var(--gray-base, #6b7280);
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.flite-question-row__follow-up-trigger select {
    font-size: 0.8125rem;
    padding: 0.25rem 1.5rem 0.25rem 0.5rem;
    min-width: 70px;
    border: 1px solid var(--gray-lighter, #d1d5db);
    border-radius: 4px;
}

.flite-question-row__follow-up-line[data-disabled="true"] .flite-question-row__follow-up-fields {
    opacity: 0.5;
    pointer-events: none;
}

.flite-question-row:last-child {
    border-bottom: none;
}

.flite-question-row--dragging {
    opacity: 0.6;
    background: var(--accent-lightest, #f0fdfa);
    border-radius: 4px;
}

.flite-question-row__handle {
    cursor: grab;
    color: var(--gray-light, #9ca3af);
    font-size: 0.875rem;
    /* Nudge down so the grip lines up with the label input (the row now
       top-aligns its handle/remove against the full-width label). */
    padding: 0.6rem 0.25rem 0.25rem;
    user-select: none;
    letter-spacing: -2px;
    line-height: 1;
}

.flite-question-row__handle:active {
    cursor: grabbing;
}

.flite-question-row__fields {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.625rem;
    flex: 1;
    min-width: 0;
}

/* The question text is the row's headline: it gets its own full-width line,
   comfortably sized, with the config controls (mapping/type/Required/Core)
   wrapping onto a subordinate second line beneath it. */
.flite-question-row__label {
    flex-basis: 100%;
    width: 100%;
    min-width: 0;
    font-size: 0.9375rem;
    font-weight: 500;
    color: var(--gray-dark, #111827);
    padding: 0.5rem 0.6875rem;
    border: 1px solid var(--gray-lighter, #d1d5db);
    border-radius: 6px;
}

.flite-question-row__label::placeholder {
    color: var(--gray-light, #9ca3af);
    font-weight: 400;
}

.flite-question-row__label:focus {
    outline: none;
    border-color: var(--accent-base, #72bbdc);
    box-shadow: 0 0 0 2px rgba(2, 97, 155, 0.15);
}

/* Mapping select has no dedicated rule otherwise and sprawls to its longest
   option; cap it so it can't crowd the config line. */
.flite-question-row__mapping {
    max-width: 15rem;
    font-size: 0.8125rem;
}

.flite-question-row__type {
    width: 120px;
    font-size: 0.8125rem;
    padding: 0.375rem 0.5rem;
    border: 1px solid var(--gray-lighter, #d1d5db);
    border-radius: 4px;
}

.flite-question-row__required {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--gray-base, #6b7280);
    white-space: nowrap;
    cursor: pointer;
}

/* The Slide slot picker — same compact toggle language as Required/Core
   (unstyled it inherited the base 1.125rem label size and dominated the row). */
.flite-question-row__slide-slot {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--gray-base, #6b7280);
    white-space: nowrap;
    cursor: pointer;
}

.flite-question-row__remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    font-size: 1.125rem;
    color: var(--gray-light, #9ca3af);
    cursor: pointer;
    padding: 0;
    width: 1.75rem;
    height: 1.75rem;
    /* Sits alongside the full-width label line (row is top-aligned). */
    margin-top: 0.1rem;
    border-radius: 4px;
    line-height: 1;
    flex-shrink: 0;
    transition: color 0.15s ease, background 0.15s ease;
}

.flite-question-row__remove:hover {
    color: #dc2626;
    background: #fef2f2;
}

.flite-question-row__remove--locked {
    cursor: default;
    font-size: 0.875rem;
}

.flite-question-row__remove--locked:hover {
    color: var(--gray-light, #9ca3af);
    background: none;
}

.flite-section-title-input {
    font-size: 0.875rem;
    font-weight: 600;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    padding: 0.375rem 0.5rem;
    flex: 1;
    max-width: 300px;
}

.flite-section-title-input:focus {
    outline: none;
    border-color: var(--accent-base, #72bbdc);
    box-shadow: 0 0 0 2px rgba(2, 97, 155, 0.15);
}

.flite-section-delete-btn {
    background: none;
    border: none;
    font-size: 0.75rem;
    color: #9ca3af;
    cursor: pointer;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    transition: color 0.15s ease, background 0.15s ease;
    white-space: nowrap;
}

.flite-section-delete-btn:hover {
    color: #dc2626;
    background: #fef2f2;
}

/* ============================================
   Revision History
   ============================================ */
.proposal-overlay__revisions {
    margin-bottom: 1.25rem;
    border: 1px solid var(--gray-lighter, #e5e7eb);
    border-radius: 6px;
    background: var(--gray-lightest, #f9fafb);
}

.proposal-overlay__revisions-toggle {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.625rem 0.75rem;
    background: none;
    border: none;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--gray-dark, #1f2937);
    cursor: pointer;
    text-align: left;
}

.proposal-overlay__revisions-toggle:hover {
    background: var(--accent-lightest, #f0fdfa);
    border-radius: 6px;
}

.proposal-overlay__revision {
    padding: 0.75rem;
    border-top: 1px solid var(--gray-lighter, #e5e7eb);
}

.proposal-overlay__revision-header {
    font-size: 0.8125rem;
    color: var(--gray-base, #4b5563);
    margin-bottom: 0.5rem;
}

.proposal-overlay__revision-field {
    margin-bottom: 0.375rem;
    padding-left: 0.5rem;
}

.proposal-overlay__revision-label {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--gray-light, #6b7280);
}

.proposal-overlay__revision-old {
    font-size: 0.8rem;
    color: #991b1b;
    background: #fef2f2;
    padding: 0.25rem 0.5rem;
    border-radius: 3px;
    text-decoration: line-through;
    margin: 0.125rem 0;
}

.proposal-overlay__revision-new {
    font-size: 0.8rem;
    color: #166534;
    background: #f0fdf4;
    padding: 0.25rem 0.5rem;
    border-radius: 3px;
    margin: 0.125rem 0;
}

/* ============================================
   Inline Editing — Proposal Fields
   ============================================ */
.proposal-overlay__fields-header {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 0.5rem;
}

.proposal-overlay__field-input {
    width: 100%;
    min-height: 80px;
    font-size: 0.85rem;
    padding: 0.5rem;
    border: 1px solid var(--accent-base, #72bbdc);
    border-radius: 4px;
    resize: vertical;
    font-family: inherit;
    margin-top: 0.25rem;
    line-height: 1.6;
}

/* Single-line widgets (selects, text/number/date/url inputs) don't need the
   tall textarea default. Multi-selects keep a modest height so options show. */
input.proposal-overlay__field-input,
select.proposal-overlay__field-input {
    min-height: 0;
    resize: none;
}

select.proposal-overlay__field-input--multi {
    min-height: 96px;
}

/* ============================================
   Platform Tags — Pills
   ============================================ */
.platform-tag-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 10px;
    line-height: 1.3;
    white-space: nowrap;
    vertical-align: middle;
}

.platform-tag-pill--small {
    font-size: 0.5625rem;
    padding: 0.1rem 0.375rem;
}

.platform-tag-pill__remove {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 0.875rem;
    line-height: 1;
    padding: 0;
    margin-left: 0.125rem;
    opacity: 0.7;
    transition: opacity 0.15s ease;
}

.platform-tag-pill__remove:hover {
    opacity: 1;
}

/* Tags section in popup */
.proposal-overlay__tags {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.375rem;
    margin-bottom: 1rem;
}

/* "+ Add tag" — a native <select> (kept: JS/tests pin its id) styled as a small
   dashed brand-blue chip. Base keeps the NATIVE dropdown arrow/behavior, which
   is the reliable path when the select sits inside a native popover="auto" (the
   pipeline kebab menu) — an appearance:none select can fail to open there. */
.proposal-overlay__tag-select {
    font-size: 0.6875rem;
    font-weight: 600;
    line-height: 1.3;
    padding: 0.15rem 0.4rem;
    border: 1px dashed var(--accent-base);
    border-radius: 10px;
    background: transparent;
    color: var(--accent-darker);
    cursor: pointer;
    outline: none;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.proposal-overlay__tag-select:hover {
    background-color: var(--flite-status-info-bg);
    border-color: var(--accent-darker);
}

.proposal-overlay__tag-select:focus-visible {
    border-color: var(--accent-darker);
    box-shadow: 0 0 0 2px var(--flite-status-info-bg);
}

/* Inside the custom proposal overlay (NOT the native kebab popover) the select
   can safely take the polished chip treatment: hidden native arrow + custom
   caret, matching the tag pills. */
.proposal-overlay-wrapper .proposal-overlay__tag-select,
.flite-reviewer .proposal-overlay__tag-select {
    padding: 0.15rem 1.4rem 0.15rem 0.6rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='6'%3E%3Cpath fill='%2302619b' d='M0 0h8L4 6z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.5rem center;
}

/* Pipeline kebab tag picker: clickable add-buttons (no native dropdown to be
   dismissed by the kebab's popover). Dashed brand-blue chips matching the pills. */
.proposal-overlay__tag-add-btn {
    display: inline-flex;
    align-items: center;
    font-size: 0.6875rem;
    font-weight: 600;
    line-height: 1.3;
    padding: 0.15rem 0.5rem;
    margin: 0 0.25rem 0.25rem 0;
    border: 1px dashed var(--accent-base);
    border-radius: 10px;
    background: transparent;
    color: var(--accent-darker);
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.proposal-overlay__tag-add-btn:hover {
    background-color: var(--flite-status-info-bg);
    border-color: var(--accent-darker);
}

/* Tags on review cards */
.flite-review-card__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    justify-content: center;
    margin-top: 0.25rem;
}

/* Tags on project chips — a single clipped row so they never wrap and change
   the chip's height; overflow is hidden (all tags remain in the popover). The
   row is ALWAYS rendered with a reserved min-height, so a card with no tags
   still holds the same footprint as one with tags (uniform height + a stable
   spot for the tag pills across every card in a section). */
.flite-project-chip__tags {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.25rem;
    margin-top: 0.125rem;
    overflow: hidden;
    max-width: 100%;
    min-height: 1.1rem;
}
.flite-project-chip__tags .platform-tag-pill {
    flex-shrink: 0;
    white-space: nowrap;
}
/* This one row carries all of a card's secondary info — status badge, round
   badge and tags together — so every card is a uniform two lines (name + info
   row). Neutralize the badges' default inline margins (flex gap spaces them) and
   keep them from shrinking. */
.flite-project-chip__tags > .flite-project-chip__badge,
.flite-project-chip__tags > .flite-project-chip__round-badge,
.flite-project-chip__tags > .flite-project-chip__new-proposal-badge,
.flite-project-chip__tags > .flite-project-chip__archived-count {
    margin-left: 0;
    flex-shrink: 0;
}

/* Tags on repo cards */
.flite-repo-card__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.2rem;
    margin-top: 0.25rem;
}

/* ============================================
   Proposal Comments / Notes
   ============================================ */
/* Save History */
.proposal-overlay__save-history {
    margin: 0.75rem 0;
    padding: 0.5rem;
    background: #fefce8;
    border: 1px solid #fde68a;
    border-radius: 4px;
    font-size: 0.7rem;
    line-height: 1.4;
}

.proposal-overlay__save-history h4 {
    margin: 0 0 0.25rem;
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #92400e;
}

.proposal-overlay__save-event {
    padding: 0.2rem 0;
    font-size: 0.675rem;
    color: #78350f;
    border-bottom: 1px solid #fde68a;
}

.proposal-overlay__save-event:last-child {
    border-bottom: none;
}

.proposal-overlay__save-event-dot {
    display: inline-block;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #d1d5db;
    vertical-align: middle;
    margin-right: 0.2rem;
}

.proposal-overlay__save-event-dot--active {
    background: #f59e0b;
}

.proposal-overlay__save-event-active {
    color: #f59e0b;
    font-weight: 600;
    font-size: 0.625rem;
}

/* === Unified proposal notes panel — used in proposal popover, presenter view === */
.proposal-notes-panel {
    margin-top: 1.25rem;
}

/* Default (popover) notes: a quiet washed panel so the thread reads as an
   intentional annotations area, not a raw form dropped into the page. The
   presenter's --compact variant keeps its bare, borderless layout. */
.proposal-notes-panel--default {
    padding: 0.875rem;
    background: var(--flite-wash);
    border: 1px solid var(--flite-line);
    border-radius: 8px;
}

.proposal-notes-panel--compact {
    margin-top: 0;
}

.proposal-notes-panel__header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 0.5rem;
}

.proposal-notes-panel__label {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--gray-dark, #1f2937);
}

/* Match the Tags eyebrow so Tags and Notes read as sibling zones. */
.proposal-notes-panel--default .proposal-notes-panel__label {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--flite-muted);
}

.proposal-notes-panel__count {
    font-size: 0.6875rem;
    color: var(--gray-light, #9ca3af);
}

.proposal-notes-panel__list {
    list-style: none;
    margin: 0 0 0.75rem;
    padding: 0;
}

.proposal-notes-panel__note {
    padding: 0.5rem 0.625rem;
    margin-bottom: 0.5rem;
    border-left: 3px solid var(--accent-base);
    background: var(--gray-lightest, #f9fafb);
    border-radius: 0 4px 4px 0;
    font-size: 0.8125rem;
}

/* On the washed default panel, notes are white "annotation" cards pinned by a
   brand-blue accent — they read as marks on the proposal, not list rows. */
.proposal-notes-panel--default .proposal-notes-panel__note {
    background: #fff;
    border-left-color: var(--accent-darker);
    border: 1px solid var(--flite-line);
    border-left: 3px solid var(--accent-darker);
}

.proposal-notes-panel--default .proposal-notes-panel__list:empty {
    display: none;
}

.proposal-notes-panel--default .proposal-notes-panel__form {
    border-top: 1px solid var(--flite-line);
    margin-top: 0.75rem;
    padding-top: 0.75rem;
}

.proposal-notes-panel--default .proposal-notes-panel__input {
    background: #fff;
}

.proposal-notes-panel__note-meta {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 0.25rem;
}

.proposal-notes-panel__note-author {
    font-size: 0.8125rem;
    color: var(--gray-dark, #1f2937);
}

.proposal-notes-panel__note-time {
    font-size: 0.6875rem;
    color: var(--gray-light, #9ca3af);
}

.proposal-notes-panel__badge {
    font-size: 0.5625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.1rem 0.375rem;
    border-radius: 3px;
}

.proposal-notes-panel__badge--public {
    background: var(--flite-status-good-bg);
    color: var(--flite-status-good-fg);
}

.proposal-notes-panel__badge--private {
    background: var(--flite-status-warn-bg);
    color: var(--flite-status-warn-fg);
}

.proposal-notes-panel__badge--partner {
    background: var(--flite-status-info-bg);
    color: var(--flite-status-info-fg);
}

.proposal-notes-panel__delete {
    background: none;
    border: none;
    color: var(--gray-light, #9ca3af);
    cursor: pointer;
    font-size: 1rem;
    line-height: 1;
    padding: 0 0.25rem;
    margin-left: auto;
    transition: color 0.15s ease;
}

.proposal-notes-panel__delete:hover {
    color: #dc2626;
}

.proposal-notes-panel__note-content {
    font-size: 0.8125rem;
    color: var(--gray-dark, #374151);
    line-height: 1.5;
}

.proposal-notes-panel__note-content p {
    margin: 0 0 0.25rem;
}

.proposal-notes-panel__form {
    border-top: 1px dashed var(--gray-lighter, #e5e7eb);
    padding-top: 0.625rem;
}

.proposal-notes-panel__input {
    width: 100%;
    font-size: 0.8125rem;
    padding: 0.4rem 0.55rem;
    border: 1px solid var(--gray-lighter, #d1d5db);
    border-radius: 4px;
    font-family: inherit;
    resize: vertical;
    box-sizing: border-box;
}

.proposal-notes-panel__form-actions {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-top: 0.4rem;
    flex-wrap: wrap;
}

.proposal-notes-panel__visibility {
    font-size: 0.75rem;
    color: var(--gray-base, #4b5563);
    display: flex;
    align-items: center;
    gap: 0.25rem;
    cursor: pointer;
}

.proposal-notes-panel__visibility-note {
    font-size: 0.7rem;
    color: var(--gray-light, #6b7280);
    flex: 1;
}

.proposal-notes-panel__submit {
    background: var(--accent-darker);
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.4rem 0.75rem;
    cursor: pointer;
    transition: background 0.15s ease;
}

.proposal-notes-panel__submit:hover {
    background: var(--accent-darker, #02619b);
}

.proposal-notes-panel__status {
    font-size: 0.7rem;
    color: var(--gray-light, #9ca3af);
}

/* === Presenter-scaled overrides — applied only inside the presenter view
       so the same notes panel partial reads well at conference-room scale. === */
.flite-presenter__side .proposal-notes-panel {
    margin-top: 0;
    padding: 1.25rem 1.5rem;
    border-top: none;
}

.flite-presenter__side .proposal-notes-panel__label {
    /* Same eyebrow language as the Reviewer-Votes label beside it. */
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--flite-presenter-muted);
}

.flite-presenter__side .proposal-notes-panel__count {
    font-size: 0.7rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--flite-presenter-muted);
    font-weight: 600;
}

.flite-presenter__side .proposal-notes-panel__note {
    background: rgba(255, 255, 255, 0.7);
    border-left-color: var(--accent-base, #72bbdc);
    padding: 0.7rem 0.85rem;
    font-size: 0.95rem;
}

.flite-presenter__side .proposal-notes-panel__note-author { font-size: 0.95rem; }
.flite-presenter__side .proposal-notes-panel__note-time   { font-size: 0.78rem; }
.flite-presenter__side .proposal-notes-panel__note-content { font-size: 0.95rem; line-height: 1.55; }

.flite-presenter__side .proposal-notes-panel__input {
    font-size: 0.95rem;
    padding: 0.55rem 0.7rem;
    border-color: var(--flite-presenter-rule);
}

.flite-presenter__side .proposal-notes-panel__submit {
    font-size: 0.85rem;
    padding: 0.5rem 0.95rem;
}

.flite-presenter__side .proposal-notes-panel__visibility,
.flite-presenter__side .proposal-notes-panel__visibility-note {
    font-size: 0.85rem;
}

/* === In-app PDF viewer modal — opened from attachment links in proposal
       popovers, the reviewer popover, and the presenter view. === */
.flite-pdf-viewer {
    position: fixed;
    inset: 0;
    /* Must sit ABOVE the proposal popover (.proposal-overlay-wrapper, z-index
       9999999) — attachments are opened from inside that popover, so the viewer
       has to render in front of it. Closing the viewer reveals the popover again. */
    z-index: 10000000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.5rem;
    box-sizing: border-box;
}

.flite-pdf-viewer[hidden] { display: none; }

.flite-pdf-viewer__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(20, 18, 14, 0.72);
    backdrop-filter: blur(2px);
    cursor: zoom-out;
}

.flite-pdf-viewer__dialog {
    position: relative;
    width: min(1200px, 100%);
    height: min(90vh, 100%);
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 24px 60px -10px rgba(0, 0, 0, 0.45);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.flite-pdf-viewer__header {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.85rem 1.1rem;
    border-bottom: 1px solid #e5e7eb;
    flex-shrink: 0;
}

.flite-pdf-viewer__title {
    margin: 0;
    flex: 1;
    font-size: 1rem;
    font-weight: 600;
    color: #1a1a1a;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.flite-pdf-viewer__actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

.flite-pdf-viewer__download {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1a1a1a;
    text-decoration: none;
    padding: 0.4rem 0.85rem;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: #ffffff;
    transition: background 0.12s ease, border-color 0.12s ease;
}

.flite-pdf-viewer__download:hover {
    background: #f9fafb;
    border-color: #d1d5db;
}

.flite-pdf-viewer__close {
    background: transparent;
    border: none;
    width: 2rem;
    height: 2rem;
    border-radius: 6px;
    cursor: pointer;
    color: #6b7280;
    font-size: 1.5rem;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.12s ease, color 0.12s ease;
}

.flite-pdf-viewer__close:hover {
    background: #f3eee4;
    color: #1a1a1a;
}

.flite-pdf-viewer__frame {
    flex: 1;
    width: 100%;
    border: none;
    background: #f3eee4;
}

/* Image / video previews fill the content area below the header and scale to
   fit (letterboxed on a dark backdrop like a standard media viewer). */
.flite-pdf-viewer__image,
.flite-pdf-viewer__video {
    flex: 1;
    min-height: 0;
    width: 100%;
    object-fit: contain;
    background: #1a1a1a;
}

.flite-pdf-viewer__image[hidden],
.flite-pdf-viewer__video[hidden],
.flite-pdf-viewer__frame[hidden] {
    display: none;
}

/* The viewer-trigger anchor in the proposal body — readable but distinct
   from regular text links. */
.flite-attachment-link {
    color: var(--accent-darker, #02619b);
    text-decoration: none;
    border-bottom: 1px solid currentColor;
    cursor: pointer;
}

.flite-attachment-link:hover {
    color: var(--accent-hover);
}

.flite-attachment-link::before {
    content: "📄 ";
    margin-right: 0.15rem;
}

/* ============================================
   No-Proposal Badge on Review Cards
   ============================================ */
.flite-review-card__no-proposal-badge {
    display: inline-block;
    margin-top: 0.375rem;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.1875rem 0.5rem;
    border-radius: 10px;
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fde68a;
}

/* ============================================
   Proposal Count Grid on Review Cards
   ============================================ */
.flite-review-card__proposal-grid {
    display: flex;
    gap: 0.25rem;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 0.125rem;
}

.flite-review-card__proposal-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    font-size: 0.625rem;
    font-weight: 700;
    border-radius: 4px;
    background: var(--accent-lightest);
    color: var(--accent-darker);
    border: 1px solid var(--accent-base);
}

/* ============================================
   No-Proposal Detail — Overlay Content
   ============================================ */
.proposal-overlay__no-proposal-detail {
    padding: 2rem 0;
}

.proposal-overlay__no-proposal-warning {
    text-align: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--gray-lighter, #e5e7eb);
}

.proposal-overlay__no-proposal-warning p {
    font-size: 0.875rem;
    color: var(--gray-base, #6b7280);
    margin: 0.75rem 0 0;
    line-height: 1.5;
}

.proposal-overlay__no-proposal-section {
    margin-bottom: 1.5rem;
}

.proposal-overlay__no-proposal-section h4 {
    font-size: 0.8125rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--accent-darker);
    margin: 0 0 0.375rem;
}

.proposal-overlay__no-proposal-section p {
    font-size: 0.875rem;
    color: var(--gray-dark, #374151);
    margin: 0 0 0.375rem;
    line-height: 1.5;
}

.proposal-overlay__no-proposal-link {
    display: inline-block;
    font-size: 0.875rem;
    color: var(--accent-darker);
    text-decoration: none;
    padding: 0.375rem 0.75rem;
    background: var(--accent-lightest, #f0fdfa);
    border: 1px solid var(--accent-base);
    border-radius: 6px;
}

.proposal-overlay__no-proposal-link:hover {
    text-decoration: underline;
    background: var(--accent-lighter, #ccfbf1);
}

.proposal-overlay__no-proposal-hint {
    font-size: 0.75rem;
    font-style: italic;
    color: var(--gray-light, #9ca3af);
}

.proposal-overlay__no-proposal-send {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.75rem;
}

.flite-review-card__send-status {
    display: inline-block;
    font-size: 0.75rem;
}

/* ============================================
   Email Preview in No-Proposal Overlay
   ============================================ */
.proposal-overlay__email-preview {
    margin: 0.75rem 0;
    border: 1px solid var(--gray-lighter, #e5e7eb);
    border-radius: 6px;
    overflow: hidden;
}

.proposal-overlay__email-preview-header {
    background: var(--gray-lightest, #fafafa);
    padding: 0.375rem 0.75rem;
    border-bottom: 1px solid var(--gray-lighter, #e5e7eb);
}

.proposal-overlay__email-preview-label {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--gray-light, #969696);
}

.proposal-overlay__email-preview-body {
    padding: 0.75rem;
    font-size: 0.8125rem;
    color: var(--gray-dark, #374151);
    line-height: 1.5;
}

.proposal-overlay__email-preview-body p {
    margin: 0 0 0.375rem;
}

.proposal-overlay__email-preview-body hr {
    border: none;
    border-top: 1px solid var(--gray-lighter, #e5e7eb);
    margin: 0.5rem 0;
}

/* ============================================
   Sealed Rounds (history chapter)
   Sealed rounds collapse to a one-line header by default.
   The "Past history" divider separates them from active rounds.
   ============================================ */
.round-card--sealed {
    background: #fafafa;
}

.round-card--sealed .round-card__name {
    color: #6b7280;
    font-weight: 500;
}

.round-card--sealed .round-card__badge {
    opacity: 0.75;
}

.round-card--focus {
    box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.12);
    border-color: #c7d2fe;
}

.round-card__new-badge {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 0.1rem 0.35rem;
    border-radius: 3px;
    background: #dcfce7;
    color: #166534;
}

/* ============================================
   Chip archived-count subtext
   ============================================ */
.flite-project-chip__archived-count {
    font-size: 0.6875rem;
    color: #9ca3af;
    font-style: italic;
    margin-left: 0.35rem;
}

/* ============================================
   Restore picker modal
   ============================================ */
.flite-picker-overlay {
    position: fixed;
    inset: 0;
    background: rgba(17, 24, 39, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
}

.flite-picker__dialog {
    background: #fff;
    border-radius: 8px;
    padding: 1.25rem;
    max-width: 520px;
    width: calc(100% - 2rem);
    box-shadow: 0 20px 40px rgba(0,0,0,0.2);
}

.flite-picker__title {
    margin: 0 0 0.25rem;
    font-size: 1.125rem;
    color: #111827;
}

.flite-picker__subtitle {
    margin: 0 0 1rem;
    font-size: 0.85rem;
    color: #6b7280;
}

.flite-picker__list {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-bottom: 1rem;
}

.flite-picker__item {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.6rem 0.75rem;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    cursor: pointer;
}

.flite-picker__item:hover {
    background: #f9fafb;
}

.flite-picker__item-body {
    display: flex;
    flex-direction: column;
}

.flite-picker__item-title {
    font-weight: 600;
    color: #111827;
    font-size: 0.875rem;
}

.flite-picker__item-round {
    font-weight: 500;
    color: #374151;
    font-size: 0.8125rem;
}

.flite-picker__item-meta {
    font-size: 0.75rem;
    color: #6b7280;
}

.flite-picker__actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

/* ============================================
   Popover header status badges
   ============================================ */
.proposal-overlay__status-badge--saved {
    background: var(--flite-status-warn-bg);
    color: var(--flite-status-warn-fg);
}

.proposal-overlay__status-badge--review {
    background: var(--flite-status-info-bg);
    color: var(--flite-status-info-fg);
}

/* ============================================
   No-proposal onboarding panel
   ============================================ */
.proposal-overlay__no-proposal-panel {
    background: #fffbeb;
    border: 1px dashed #fcd34d;
    border-radius: 6px;
    padding: 0.875rem 1rem;
    margin-bottom: 1rem;
}

.proposal-overlay__no-proposal-panel p {
    margin: 0.5rem 0;
    font-size: 0.85rem;
    color: #78350f;
}

.proposal-overlay__no-proposal-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    margin-top: 0.5rem;
}

/* ============================================
   FLITE Presenter Mode (fullscreen meeting)
   ============================================ */
/* (Reviewer / Presenter launch buttons now use .flite-btn; the disabled state
   is handled by .flite-btn.is-disabled.) */

.flite-presenter {
    position: fixed;
    inset: 0;
    background: var(--flite-wash, #f9fafb);
    display: flex;
    flex-direction: column;
    z-index: 100000;
    /* ONE family — the app's own (Interstate/Overpass) — so the fullscreen
       modes read as the same product as the dashboard and popovers. (The
       previous 'Geist'/'Newsreader' faces were never shipped, so this was
       silently rendering a chaotic Segoe/Georgia mix.) Hierarchy comes from
       size + weight + the shared eyebrow-label style, not family mixing. */
    font-family: var(--font-family, Interstate, Overpass, sans-serif);
    --flite-presenter-display: var(--font-family, Interstate, Overpass, sans-serif);
    --flite-presenter-paper: #ffffff;
    --flite-presenter-ink: var(--flite-ink, #1f2937);
    --flite-presenter-rule: var(--flite-line, #e5e7eb);
    --flite-presenter-muted: var(--flite-muted, #6b7280);
}

/* 1fr|auto|1fr grid so the title column sits at the TRUE viewport center —
   with flex it centered between the lone Prev button and the (wider) actions
   group, landing visibly left of the slide content's center line. */
.flite-presenter__nav {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 1.25rem;
    padding: 0.85rem 1.5rem;
    background: var(--flite-presenter-paper);
    border-bottom: 1px solid var(--flite-presenter-rule);
}

.flite-presenter__nav > .flite-presenter__nav-btn {
    justify-self: start;
}

.flite-presenter__nav-actions {
    justify-self: end;
}

.flite-presenter__error-banner {
    background: #fee2e2;
    border-bottom: 2px solid #dc2626;
    color: #7f1d1d;
    padding: 0.6rem 1.5rem;
    font-size: 0.875rem;
    font-weight: 500;
}

.flite-presenter__nav-title {
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.flite-presenter__slide-counter {
    font-size: 0.7rem;
    color: var(--flite-presenter-muted);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 700;
}

.flite-presenter__slide-name {
    font-family: var(--flite-presenter-display);
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--flite-presenter-ink);
    letter-spacing: -0.01em;
}

.flite-presenter__nav-actions {
    display: flex;
    gap: 0.4rem;
    align-items: center;
}

.flite-presenter__nav-btn {
    background: var(--flite-presenter-paper);
    border: 1px solid var(--flite-presenter-rule);
    border-radius: 6px;
    padding: 0.55rem 1.1rem;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--flite-presenter-ink);
    cursor: pointer;
    transition: background 0.12s ease, border-color 0.12s ease, transform 0.08s ease;
}

.flite-presenter__nav-btn:active {
    transform: translateY(1px);
}

.flite-presenter__nav-btn:hover {
    background: #f3f4f6;
    border-color: #9ca3af;
}

.flite-presenter__nav-btn--primary {
    background: var(--accent-darker);
    color: #fff;
    border-color: var(--accent-darker);
}

.flite-presenter__nav-btn--primary:hover {
    background: var(--accent-darker, #02619b);
    border-color: var(--accent-darker, #02619b);
}

.flite-presenter__nav-btn--exit {
    color: #b91c1c;
    border-color: #fecaca;
}

.flite-presenter__nav-btn--exit:hover {
    background: #fee2e2;
    border-color: #fca5a5;
}

.flite-presenter__deck {
    flex: 1;
    overflow: hidden;
    position: relative;
}

.flite-presenter__slide {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: 340px 1fr 400px;
    grid-template-rows: 1fr auto;
    grid-template-areas:
        "startup proposal side"
        "decision decision decision";
    gap: 0;
    background: var(--flite-presenter-paper);
    animation: flite-presenter-slide-in 0.32s ease-out;
}

/* Reviewer Mode: no votes/notes side column and no decision row — drop those
   grid tracks so the proposal panel expands to fill the freed space. Compound
   selector (two classes) so it outranks the base rule regardless of order. */
.flite-presenter__slide.flite-presenter__slide--review {
    grid-template-columns: 340px 1fr;
    grid-template-rows: 1fr;
    grid-template-areas: "startup proposal";
}

/* Overview slide — deck opener (presenter and reviewer modes): round title
   centered, topline numbers pinned to the top-right corner. Compound selector
   so it overrides the base slide grid. */
.flite-presenter__slide.flite-presenter__slide--overview {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding-top: 9vh;
    padding-bottom: 3rem;
    overflow-y: auto;
}

/* Settings-configured FLITE logo, mirroring the stats block's corner offset. */
.flite-overview__logo {
    position: absolute;
    top: 2.5rem;
    left: 3rem;
    max-height: 6rem;
    max-width: 16rem;
    object-fit: contain;
}

.flite-overview__stats {
    position: absolute;
    top: 2.5rem;
    right: 3rem;
    display: flex;
    flex-direction: column;
    gap: 2.25rem;
    text-align: right;
}

.flite-overview__stat {
    display: flex;
    flex-direction: column;
}

.flite-overview__number {
    font-size: 7rem;
    font-weight: 700;
    line-height: 1;
    color: var(--flite-presenter-ink);
}

.flite-overview__number--score {
    font-size: 3.25rem;
}

.flite-overview__denom {
    font-size: 0.45em;
    font-weight: 600;
    color: var(--gray-base, #6b7280);
}

.flite-overview__label {
    margin-top: 0.4rem;
    font-size: 0.95rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--gray-base, #6b7280);
}

.flite-overview__heading {
    text-align: center;
    padding: 0 4rem;
}

.flite-overview__title {
    margin: 0;
    font-size: 4rem;
    font-weight: 700;
    color: var(--flite-presenter-ink);
}

.flite-overview__dates {
    margin: 0.75rem 0 0;
    font-size: 1.5rem;
    color: var(--gray-base, #6b7280);
}

.flite-overview__tags,
.flite-overview__locations,
.flite-overview__breakdown {
    margin-top: 2.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2.5rem;
    width: 80%; /* fixed (not max-) so every group's separator spans one line */
}

.flite-overview__locations,
.flite-overview__breakdown {
    padding-top: 2.5rem;
    border-top: 1px solid var(--flite-presenter-rule, #e5e7eb);
}

/* Each row is a shared 2-track grid (name zone above the line, count below)
   that every card subgrids into — the underline sits on the shared track
   boundary, so it lands at the same height on every card in the row, sized
   by the row's tallest name (no fixed heights to overflow). */
.flite-overview__tags-row {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 13.5rem;
    grid-template-rows: auto auto;
    justify-content: center;
    column-gap: 3.5rem;
}

/* Per-tag mini stat: uniform slightly-tall cards so short and long tag names
   read as one set — long names wrap to a second line inside the fixed width.
   Underline accent is the FLITE brand blue for every tag. */
.flite-overview__tag-stat {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 2;
    justify-items: center;
    padding: 1.1rem 1rem;
    border: 1px solid var(--flite-presenter-rule, #e5e7eb);
    border-radius: 10px;
}

/* Fills the shared name track, centers 1-liners vertically against taller
   neighbors, and keeps the text clear of the underline via padding — the
   track grows with the longest name, so nothing can bleed through the line. */
.flite-overview__tag-name {
    display: flex;
    align-items: center;
    justify-content: center;
    justify-self: stretch;
    min-height: 3rem;
    padding-bottom: 0.5rem;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.3;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-align: center;
    color: var(--gray-base, #6b7280);
    border-bottom: 3px solid var(--accent-darker, #02619b);
}

.flite-overview__tag-number {
    display: flex;
    align-items: center;
    min-height: 4.5rem; /* matching count zone below the line on every card */
    font-size: 2.75rem;
    font-weight: 700;
    line-height: 1;
    color: var(--flite-presenter-ink);
}

/* Presenter Settings modal — draggable startup order rows */
.presenter-order-item {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.4rem;
    border: 1px solid var(--flite-border, #e5e7eb);
    border-radius: 6px;
    background: #fff;
    cursor: grab;
    user-select: none;
}

.presenter-order-item:active {
    cursor: grabbing;
}

.presenter-order-item.sortable-ghost {
    opacity: 0.4;
}

.presenter-order-item__handle {
    color: var(--gray-base, #9ca3af);
}

.presenter-order-item__body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.presenter-order-item__name {
    font-weight: 600;
}

.presenter-order-item__proposal {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.4rem;
    font-size: 0.85rem;
    color: var(--gray-base, #6b7280);
}

.presenter-order-item__title {
    font-weight: 500;
}

.presenter-order-item__score {
    margin-left: auto;
    font-weight: 600;
    color: var(--flite-ink, #1f2937);
}

/* Presenter Settings needs more room than the confirm-style modals. */
.flite-modal--wide {
    max-width: 640px;
}

/* The shared project-list caps at 300px (sized for the Advance Round modal);
   the reorder list should use most of the screen instead. */
.presenter-order-list {
    max-height: 62vh;
}

@keyframes flite-presenter-slide-in {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Startup sidebar (left) */
.flite-presenter__startup {
    grid-area: startup;
    background: var(--flite-presenter-paper);
    border-right: 1px solid var(--flite-presenter-rule);
    padding: 1.5rem 1.5rem 2rem;
    overflow-y: auto;
}

.flite-presenter__startup-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.6rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--flite-presenter-rule);
    margin-bottom: 1.25rem;
}

.flite-presenter__logo {
    width: 116px;
    height: 116px;
    border-radius: 14px;
    object-fit: contain;
    padding: 8px;
    background: #f9fafb;
    box-shadow: 0 1px 0 rgba(0,0,0,0.04), 0 4px 14px rgba(0, 0, 0, 0.05);
}

/* Wordmark-shaped (wide) logos — a square card squeezes them tiny, so the
   card grows wide instead. Added by the image's onload aspect check
   (naturalWidth > 1.4 × naturalHeight) in flite_presenter/_slide. */
.flite-presenter__logo--wide {
    width: auto;
    height: auto;
    max-width: min(260px, 100%);
    max-height: 92px;
}

.flite-presenter__startup-name {
    font-family: var(--flite-presenter-display);
    font-size: 1.7rem;
    font-weight: 700;
    line-height: 1.15;
    margin: 0.25rem 0 0;
    color: var(--flite-presenter-ink);
    letter-spacing: -0.01em;
    text-transform: none;
}

.flite-presenter__startup-website {
    font-size: 0.95rem;
    color: var(--accent-darker, #02619b);
    text-decoration: none;
    word-break: break-all;
    border-bottom: 1px solid transparent;
    transition: border-color 0.15s;
}

.flite-presenter__startup-website:hover { border-bottom-color: currentColor; }

.flite-presenter__startup-details {
    margin: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

.flite-presenter__startup-details dt {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--flite-presenter-muted);
    margin-bottom: 0.3rem;
}

.flite-presenter__startup-details dd {
    margin: 0 0 0.65rem;
    font-size: 1.05rem;
    color: var(--flite-presenter-ink);
    line-height: 1.5;
    word-break: break-word;
}

.flite-presenter__startup-email {
    color: var(--flite-presenter-muted);
    font-size: 0.9rem;
}

/* Proposal column (center) */
.flite-presenter__proposal {
    grid-area: proposal;
    background: var(--flite-presenter-paper);
    overflow-y: auto;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.flite-presenter__proposal-meta {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.4rem 0.85rem;
    font-size: 0.95rem;
    color: var(--flite-presenter-muted);
    padding: 1.5rem 2rem 1.05rem;
    border-bottom: 1px solid var(--flite-presenter-rule);
}

.flite-presenter__proposal-title {
    font-family: var(--flite-presenter-display);
    font-size: 1.85rem;
    font-weight: 700;
    color: var(--flite-presenter-ink);
    margin: 0 0 0.15rem;
    line-height: 1.15;
    letter-spacing: -0.015em;
    text-transform: none;
    flex-basis: 100%;
}

.flite-presenter__proposal-meta-submitter {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.35rem;
    font-size: 0.78rem;
    color: var(--flite-presenter-muted);
}

.flite-presenter__proposal-meta-submitter strong {
    color: var(--flite-presenter-ink);
    font-size: 0.82rem;
    font-weight: 600;
}
.flite-presenter__proposal-meta-email { color: var(--flite-presenter-muted); font-size: 0.78rem; }
.flite-presenter__proposal-meta-date  { font-size: 0.78rem; }
.flite-presenter__proposal-meta-spacer { display: none; }

.flite-presenter__tabs {
    display: flex;
    gap: 0;
    background: var(--flite-presenter-paper);
    padding: 0 2rem;
    flex-shrink: 0;
    border-bottom: 1px solid var(--flite-presenter-rule);
}

.flite-presenter__tab {
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 0.85rem 0;
    margin-right: 1.75rem;
    font-family: inherit;
    color: var(--flite-presenter-muted);
    cursor: pointer;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    transition: color 0.15s ease, border-color 0.15s ease;
}

.flite-presenter__tab:hover {
    color: var(--flite-presenter-ink);
}

.flite-presenter__tab--active {
    color: var(--flite-presenter-ink);
    border-bottom-color: var(--accent-base, #72bbdc);
}

.flite-presenter__tab-label {
    font-family: inherit;
    font-size: 0.92rem;
    font-weight: 500;
    font-variation-settings: normal;
    line-height: 1.1;
    letter-spacing: 0.005em;
}

.flite-presenter__tab--active .flite-presenter__tab-label {
    font-weight: 600;
}

.flite-presenter__tab-meta {
    font-size: 0.78rem;
    color: var(--flite-presenter-muted);
    font-weight: 500;
    letter-spacing: 0.01em;
}

.flite-presenter__tab--active .flite-presenter__tab-meta {
    color: var(--accent-darker, #02619b);
}

.flite-presenter__proposal-panel {
    padding: 1.75rem 2rem 2.5rem;
}

/* Slide one-pager inside the presenter/reviewer modes: scale up slightly for
   conference-room legibility, keep a readable measure on very wide screens,
   and drop the tags footer (tags already sit in the meta strip above). */
.flite-presenter__proposal-panel--slide .flite-slide {
    font-size: 1rem;
    /* Left-aligned with a capped measure — centering left a weird dead gap
       between the startup sidebar and the slide on wide screens. */
    max-width: 72rem;
    margin: 0;
    padding: 0.5rem 0 1rem;
}
.flite-presenter__proposal-panel--slide .flite-slide__tags {
    display: none;
}

.flite-presenter__proposal-fields {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.flite-presenter__section-heading {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--accent-darker, #02619b);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 1.25rem 0 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--flite-presenter-rule);
}

.flite-presenter__section-heading:first-child {
    margin-top: 0;
}

.flite-presenter__field {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.flite-presenter__field dt {
    /* Sentence-case question label in the mid brand blue (same language as
       the popover) — pairs with the dark-blue section headings above. */
    font-size: 0.95rem;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    color: var(--accent-mid, #2f85b5);
    margin: 0;
}

.flite-presenter__field dd {
    margin: 0;
    font-size: 1.2rem;
    line-height: 1.55;
    color: var(--flite-presenter-ink);
    font-weight: 400;
}

.flite-presenter__field dd p { margin: 0 0 0.6rem; }
.flite-presenter__field dd p:last-child { margin-bottom: 0; }

.flite-presenter__empty {
    padding: 3rem 2rem;
    color: var(--flite-presenter-muted);
    text-align: center;
    font-style: italic;
    font-size: 1.1rem;
}

/* Core tab — empty state when no questions are marked core */
.flite-presenter__core-empty {
    padding: 3rem 2rem;
    text-align: center;
    color: var(--flite-presenter-muted);
    border: 1px dashed var(--flite-presenter-rule);
    border-radius: 10px;
    margin: 1rem 0;
    background: rgba(255, 255, 255, 0.6);
}

.flite-presenter__core-empty-title {
    font-family: var(--flite-presenter-display);
    font-size: 1.4rem;
    font-weight: 500;
    color: var(--flite-presenter-ink);
    margin: 0 0 0.5rem;
}

.flite-presenter__core-empty-hint {
    margin: 0;
    font-size: 1rem;
    line-height: 1.55;
    color: var(--flite-presenter-muted);
    max-width: 38rem;
    margin: 0 auto;
}

.flite-presenter__core-empty-hint strong {
    color: var(--flite-presenter-ink);
    font-weight: 600;
}

/* Right side panel: votes + notes */
.flite-presenter__side {
    grid-area: side;
    background: #f9fafb;
    border-left: 1px solid var(--flite-presenter-rule);
    overflow-y: auto;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.flite-presenter__side-panel {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

/* Votes */
.flite-presenter__votes {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--flite-presenter-rule);
    background: var(--flite-presenter-paper);
}

.flite-presenter__votes-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}

.flite-presenter__votes-label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--flite-presenter-muted);
}

.flite-presenter__votes-avg-num {
    font-family: var(--flite-presenter-display);
    font-size: 1.85rem;
    font-weight: 700;
    color: var(--flite-presenter-ink);
    line-height: 1;
}

.flite-presenter__votes-avg-out {
    font-size: 0.95rem;
    color: var(--flite-presenter-muted);
}

.flite-presenter__votes-avg-count {
    font-size: 0.85rem;
    color: var(--flite-presenter-muted);
    margin-left: 0.4rem;
}

.flite-presenter__votes-avg-empty {
    font-size: 0.95rem;
    color: var(--flite-presenter-muted);
    font-style: italic;
}

.flite-presenter__votes-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    max-height: 260px;
    overflow-y: auto;
}

.flite-presenter__vote {
    padding: 0.55rem 0.75rem;
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid var(--flite-presenter-rule);
    border-radius: 6px;
    font-size: 0.95rem;
}

.flite-presenter__vote-row {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.flite-presenter__vote-stars { letter-spacing: 0.08em; }
.flite-presenter__vote-star { color: #d1d5db; font-size: 1rem; }
.flite-presenter__vote-star--filled { color: #d97706; }

.flite-presenter__vote-user {
    color: var(--flite-presenter-muted);
    font-weight: 600;
    margin-left: auto;
    font-size: 0.85rem;
}

.flite-presenter__vote-comment {
    margin: 0.4rem 0 0;
    color: var(--flite-presenter-ink);
    line-height: 1.5;
    font-size: 0.95rem;
}

/* Notes */
.flite-presenter__notes {
    padding: 0.85rem 1rem;
    background: #fafafa;
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.flite-presenter__notes-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 0.5rem;
}

.flite-presenter__notes-label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--flite-presenter-muted);
}

.flite-presenter__notes-count {
    font-size: 0.7rem;
    color: #9ca3af;
}

.flite-presenter__notes-list {
    list-style: none;
    margin: 0 0 0.5rem;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    overflow-y: auto;
    flex: 1;
}

.flite-presenter__note {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    padding: 0.4rem 0.55rem;
}

.flite-presenter__note-meta {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.4rem;
    margin-bottom: 0.2rem;
    font-size: 0.7rem;
}

.flite-presenter__note-author {
    color: #1f2937;
    font-weight: 600;
}

.flite-presenter__note-time {
    color: #9ca3af;
}

.flite-presenter__note-content {
    margin: 0;
    font-size: 0.8rem;
    color: #1f2937;
    line-height: 1.4;
}

.flite-presenter__notes-form {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    border-top: 1px dashed #d1d5db;
    padding-top: 0.5rem;
    flex-shrink: 0;
}

.flite-presenter__notes-input {
    width: 100%;
    padding: 0.4rem 0.55rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    font-size: 0.8rem;
    resize: vertical;
    font-family: inherit;
    box-sizing: border-box;
}

.flite-presenter__notes-input:focus {
    outline: none;
    border-color: var(--accent-base, #72bbdc);
    box-shadow: 0 0 0 2px rgba(2, 97, 155, 0.18);
}

.flite-presenter__notes-submit {
    align-self: flex-end;
    background: var(--accent-darker);
    color: #fff;
    border: none;
    border-radius: 4px;
    padding: 0.35rem 0.85rem;
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
}

.flite-presenter__notes-submit:hover {
    background: var(--accent-darker, #02619b);
}

/* Decision bar (bottom) */
.flite-presenter__decision-bar {
    grid-area: decision;
    background: var(--flite-presenter-paper);
    border-top: 1px solid var(--flite-presenter-rule);
    padding: 1.1rem 1.75rem;
    display: flex;
    align-items: center;
    gap: 0.65rem;
    flex-wrap: wrap;
}

.flite-presenter__decision-label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--flite-presenter-muted);
    margin-right: 0.4rem;
}

.flite-presenter__decision-btn {
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid var(--flite-presenter-rule);
    border-radius: 999px;
    padding: 0.55rem 1.25rem;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--flite-presenter-ink);
    cursor: pointer;
    transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease, transform 0.08s ease;
}

.flite-presenter__decision-btn:active { transform: translateY(1px); }

.flite-presenter__decision-btn:hover {
    background: #ffffff;
    border-color: #9ca3af;
}

.flite-presenter__decision-btn.active {
    background: var(--accent-darker);
    color: #ffffff;
    border-color: var(--accent-darker);
}

.flite-presenter__decision-btn--clear {
    color: #6b7280;
    background: transparent;
    border-color: #e5e7eb;
    margin-left: 0.25rem;
}

.flite-presenter__decision-btn--clear:hover {
    background: #f3f4f6;
    color: #111827;
}

.flite-presenter__decision-current {
    margin-left: auto;
    font-size: 0.95rem;
    color: var(--flite-presenter-muted);
}

.flite-presenter__decision-current strong {
    color: var(--flite-presenter-ink);
    font-weight: 600;
}

/* Wrap-up screen */
.flite-presenter-wrapup {
    min-height: 100vh;
    background: #f3f4f6;
    display: flex;
    flex-direction: column;
}

.flite-presenter-wrapup__nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e5e7eb;
}

.flite-presenter-wrapup__title {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 700;
    color: #111827;
}

.flite-presenter-wrapup__body {
    flex: 1;
    max-width: 900px;
    width: 100%;
    margin: 1.5rem auto;
    padding: 0 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.flite-presenter-wrapup__group {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    overflow: hidden;
}

.flite-presenter-wrapup__group--empty {
    background: #fafafa;
    opacity: 0.85;
}

.flite-presenter-wrapup__group-title {
    margin: 0;
    padding: 0.75rem 1rem;
    background: #f9fafb;
    border-bottom: 1px solid #f3f4f6;
    font-size: 0.95rem;
    font-weight: 700;
    color: #111827;
}

.flite-presenter-wrapup__group-count {
    color: #9ca3af;
    font-weight: 500;
    margin-left: 0.25rem;
}

.flite-presenter-wrapup__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.flite-presenter-wrapup__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.65rem 1rem;
    border-bottom: 1px solid #f3f4f6;
}

.flite-presenter-wrapup__row:last-child { border-bottom: none; }

.flite-presenter-wrapup__startup {
    font-weight: 600;
    color: #1f2937;
}

.flite-presenter-wrapup__row-meta {
    font-size: 0.75rem;
    color: #9ca3af;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.flite-presenter-wrapup__notes-pill {
    background: #eef2ff;
    color: #4f46e5;
    padding: 0.1rem 0.45rem;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 600;
}

.flite-presenter-wrapup__empty {
    padding: 2rem;
    text-align: center;
    color: #9ca3af;
    font-style: italic;
}

.flite-presenter-wrapup__footer {
    background: #ffffff;
    border-top: 1px solid #e5e7eb;
    padding: 0.85rem 1.5rem;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    position: sticky;
    bottom: 0;
}

/* ── "Download Full PDF" loading overlay ─────────────────────────────────── */
/* Wrapper is transparent to layout so the button stays a normal flex item. */
.flite-pdf-dl {
    display: contents;
}

.flite-pdf-overlay {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(17, 24, 39, 0.55);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}

.flite-pdf-overlay[hidden] {
    display: none;
}

.flite-pdf-overlay__card {
    position: relative;
    background: #ffffff;
    border-radius: 14px;
    padding: 28px 34px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    max-width: 320px;
    text-align: center;
}

/* Corner X — aborts the in-flight request and dismisses the overlay. */
.flite-pdf-overlay__cancel {
    position: absolute;
    top: 6px;
    right: 10px;
    border: none;
    background: none;
    padding: 4px;
    font-size: 20px;
    line-height: 1;
    color: #9ca3af;
    cursor: pointer;
}

.flite-pdf-overlay__cancel:hover {
    color: #374151;
}

.flite-pdf-overlay__spinner {
    position: relative;
    width: 72px;
    height: 72px;
    display: grid;
    place-items: center;
}

.flite-pdf-overlay__ring {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 4px solid rgba(2, 97, 155, 0.15);
    border-top-color: #02619b;
    animation: flite-pdf-spin 0.9s linear infinite;
}

.flite-pdf-overlay__logo {
    width: 40px;
    height: 40px;
    object-fit: contain;
}

.flite-pdf-overlay__msg {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: #374151;
}

.flite-pdf-overlay__hint {
    margin: 0;
    font-size: 12px;
    line-height: 1.5;
    color: #6b7280;
    text-align: center;
}

.flite-pdf-overlay__dismiss {
    display: none;
    border: 1px solid #d1d5db;
    background: #f9fafb;
    color: #374151;
    border-radius: 8px;
    padding: 6px 16px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.flite-pdf-overlay__dismiss:hover {
    background: #f3f4f6;
}

/* Error state: stop the spinner, tint it red, reveal the Close button. */
.flite-pdf-overlay.is-error .flite-pdf-overlay__ring {
    animation: none;
    border-color: rgba(220, 38, 38, 0.25);
    border-top-color: #dc2626;
}

.flite-pdf-overlay.is-error .flite-pdf-overlay__dismiss {
    display: inline-block;
}

@keyframes flite-pdf-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .flite-pdf-overlay__ring {
        animation-duration: 2.2s;
    }
}

/* ==========================================================================
   FLITE public proposal form — scoped redesign.

   Loaded globally via application.css (require_tree .), so EVERY rule is
   scoped under `.flite-public` (set on the <body> of the flite_application
   layout) to override the global base.css without leaking elsewhere.

   Brand: dark blue #02619B, light blue #72BBDC. Arial throughout.
   ========================================================================== */

.flite-public {
  --flite-dark: #02619B;
  --flite-dark-hover: #024d7c;
  --flite-light: #72BBDC;
  --flite-light-soft: #e3f1f9;
  --flite-ink: #1f2937;
  --flite-label: #374151;
  --flite-muted: #6b7280;
  --flite-border: #d8dee6;
  --flite-card-border: #e7ebf1;

  font-family: Arial, Helvetica, sans-serif;
  color: var(--flite-ink);
  font-size: 1rem;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

/* Make the whole scope inherit Arial, overriding base.css's font on
   inputs/selects/buttons/headings. */
.flite-public,
.flite-public input,
.flite-public textarea,
.flite-public select,
.flite-public button,
.flite-public .button,
.flite-public h1,
.flite-public h2,
.flite-public h3,
.flite-public legend,
.flite-public label {
  font-family: Arial, Helvetica, sans-serif;
}

/* --------------------------------------------------------------------------
   Branding header (logo + rich-text intro)
   -------------------------------------------------------------------------- */
.flite-public .flite-program-intro {
  /* This is a <header>, and the global components/header.css styles the bare
     `header` element as a black, 3-column grid (the app's top nav). Reset that
     so our branding block is a normal, full-width, light section. */
  display: block;
  background: transparent;
  color: inherit;
  font-size: 1rem;
  grid-template-columns: none;
  text-align: center;
  margin: 0 0 2.5rem;
  padding-bottom: 1.75rem;
  border-bottom: 1px solid var(--flite-card-border);
}

.flite-public .flite-program-intro__logo {
  display: block;
  margin: 0 auto 1rem;
  max-height: 96px;
  max-width: 320px;
  width: auto;
  height: auto;
}

.flite-public .flite-program-intro__title {
  color: var(--flite-dark);
  font-size: 1.9rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  text-transform: none;
  margin: 0 0 0.5rem;
}

.flite-public .flite-program-intro__text {
  max-width: 640px;
  margin: 0.75rem auto 0;
  text-align: left;
  color: var(--flite-label);
  font-size: 0.95rem;
  line-height: 1.65;
}

/* Trix renders each paragraph as a <div> (not <p>), so target both. */
.flite-public .flite-program-intro__text p,
.flite-public .flite-program-intro__text .trix-content > div {
  margin: 0 0 0.85rem;
}
.flite-public .flite-program-intro__text p:last-child,
.flite-public .flite-program-intro__text .trix-content > div:last-child {
  margin-bottom: 0;
}

/* Rich-text content (ActionText / Trix) inside the intro */
.flite-public .flite-program-intro__text .trix-content {
  font-size: 0.95rem;
  line-height: 1.65;
}
.flite-public .flite-program-intro__text a,
.flite-public .flite-program-intro__text .trix-content a {
  color: var(--flite-dark);
  text-decoration: underline;
  text-underline-offset: 2px;
  font-weight: 700;
  text-transform: none; /* override global `header a` uppercase */
  letter-spacing: 0;
}
.flite-public .flite-program-intro__text a:hover {
  color: var(--flite-dark-hover);
}

/* --------------------------------------------------------------------------
   Page heading (e.g. "Apply to FLITE")
   -------------------------------------------------------------------------- */
.flite-public main > h2 {
  color: var(--flite-dark);
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  text-transform: none;
  margin: 0 0 1.75rem;
}

/* --------------------------------------------------------------------------
   Section cards (fieldset + legend)
   -------------------------------------------------------------------------- */
.flite-public fieldset {
  border: 1px solid var(--flite-card-border);
  border-radius: 12px;
  background: #ffffff;
  padding: 1.5rem 1.75rem 1.75rem;
  margin: 0 0 1.75rem;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04), 0 4px 16px rgba(2, 97, 155, 0.04);
}

.flite-public fieldset > legend {
  display: block;
  width: 100%;
  float: left; /* keeps the underline full-width across browsers */
  color: var(--flite-dark);
  font-size: 1.4rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  text-transform: none;
  padding: 0 0 0.6rem;
  margin-bottom: 1.4rem;
  border-bottom: 2px solid var(--flite-light);
}
.flite-public fieldset > legend + * {
  clear: both; /* clear the floated legend */
}

/* --------------------------------------------------------------------------
   Question fields
   -------------------------------------------------------------------------- */
.flite-public .field {
  margin-bottom: 1.35rem;
}
.flite-public .field:last-child {
  margin-bottom: 0;
}

.flite-public .field > label,
.flite-public .field label:first-child {
  display: block;
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--flite-label);
  letter-spacing: 0;
  line-height: 1.35;
  margin-bottom: 0.4rem;
}

/* Inline option labels (checkbox / radio / agreement) stay normal-weight */
.flite-public .checkbox-group label,
.flite-public .boolean-group label,
.flite-public .field > label[style*="flex"] {
  display: flex;
  font-size: 0.9rem;
  font-weight: 400;
  color: var(--flite-ink);
  margin-bottom: 0.3rem;
}

/* Text inputs, textareas, selects */
.flite-public input[type="text"],
.flite-public input[type="email"],
.flite-public input[type="url"],
.flite-public input[type="number"],
.flite-public input[type="date"],
.flite-public input[type="tel"],
.flite-public textarea,
.flite-public select {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  font-size: 0.9rem;
  line-height: 1.45;
  letter-spacing: 0;
  color: var(--flite-ink);
  background: #ffffff;
  border: 1px solid var(--flite-border);
  border-radius: 8px;
  padding: 0.6rem 0.8rem;
  box-shadow: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.flite-public textarea {
  min-height: 7rem;
  resize: vertical;
}

/* Clean select: white bg + a simple chevron (override base.css gradient/arrow) */
.flite-public select {
  appearance: none;
  -webkit-appearance: none;
  font-weight: 400;
  padding-right: 2.25rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%2302619B' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.85rem center;
  background-size: 12px 8px;
}

/* Focus: light-blue ring */
.flite-public input:focus,
.flite-public textarea:focus,
.flite-public select:focus {
  outline: none;
  border-color: var(--flite-light);
  box-shadow: 0 0 0 3px rgba(114, 187, 220, 0.35);
}

.flite-public ::placeholder {
  color: #9aa3af;
}

/* Checkboxes / radios: tidy, brand-colored, not the global 1.5x scale */
.flite-public input[type="checkbox"],
.flite-public input[type="radio"] {
  transform: none;
  width: 1.05rem;
  height: 1.05rem;
  margin: 0;
  accent-color: var(--flite-dark);
  flex: 0 0 auto;
}

.flite-public .checkbox-group,
.flite-public .boolean-group {
  margin-top: 0.15rem;
}

/* File input */
.flite-public input[type="file"] {
  font-size: 0.85rem;
  color: var(--flite-muted);
}

/* Follow-up (conditional) field: light-blue accent rail */
.flite-public .follow-up-field {
  margin-top: 0.6rem;
  padding-left: 1rem;
  border-left: 3px solid var(--flite-light);
}

/* --------------------------------------------------------------------------
   Submit button
   -------------------------------------------------------------------------- */
.flite-public .actions {
  margin-top: 2rem;
}

.flite-public #flite-apply-submit,
.flite-public .actions .button,
.flite-public .actions input[type="submit"] {
  display: inline-block;
  background-color: var(--flite-dark);
  color: #ffffff;
  border: none;
  border-radius: 8px;
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  padding: 0.8rem 2.1rem;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(2, 97, 155, 0.25);
  transition: background-color 0.15s ease, box-shadow 0.15s ease, transform 0.05s ease;
}

.flite-public #flite-apply-submit:hover,
.flite-public .actions .button:hover,
.flite-public .actions input[type="submit"]:hover {
  background-color: var(--flite-dark-hover);
  box-shadow: 0 4px 12px rgba(2, 97, 155, 0.3);
}
.flite-public #flite-apply-submit:active,
.flite-public .actions input[type="submit"]:active {
  transform: translateY(1px);
}
.flite-public #flite-apply-submit:disabled,
.flite-public .actions input[type="submit"]:disabled {
  background-color: #9bb6c8;
  box-shadow: none;
  cursor: not-allowed;
  opacity: 0.85;
}

/* --------------------------------------------------------------------------
   Flash / error messaging
   -------------------------------------------------------------------------- */
.flite-public .flash--alert,
.flite-public .flash.flash--alert {
  border-radius: 8px;
}
.flite-public .flash--alert h3 {
  text-transform: none;
  font-size: 1rem;
  color: #b42318;
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 640px) {
  .flite-public fieldset {
    padding: 1.25rem 1.1rem 1.4rem;
  }
  .flite-public fieldset > legend {
    font-size: 1.2rem;
  }
  .flite-public .flite-program-intro__title {
    font-size: 1.55rem;
  }
}
@font-face {
    font-display: swap;
    font-family: Overpass;
    font-style: normal;
    font-weight: 300;
    src: url(/assets/Overpass-latin-Light-b6de253e3957ce635633016a05d248bf37d8693f9fbf25162c0ead0c962ad1f4.woff2) format('woff2-variations');
    unicode-range: U+0020-007F, U+00A0-00FF;
}
@font-face {
    font-display: swap;
    font-family: Overpass;
    font-style: normal;
    font-weight: 400;
    src: url(/assets/Overpass-latin-Regular-9e7067990c8833cdadf32343f79dd1e2df4e117bb5388987a1169118bd013a5b.woff2) format('woff2-variations');
    unicode-range: U+0020-007F, U+00A0-00FF;
}
@font-face {
    font-display: swap;
    font-family: Overpass;
    font-style: normal;
    font-weight: 700;
    src: url(/assets/Overpass-latin-Bold-128ea00ceb02e0ea518c614721cd9cc84de114cc480b79b68bed9baeeca11d00.woff2) format('woff2-variations');
    unicode-range: U+0020-007F, U+00A0-00FF;
}

/* Overpass with corrected vertical metrics, for tight badges/counters only.
   Overpass's oversized ascender makes glyphs sit visibly HIGH when centered in
   a small fixed-height box (.flite-count section counters). Overriding the
   ascent/descent split re-centers cap-height glyphs (digits) in the em box, so
   any line-box centering lands them dead-center at every zoom level — unlike a
   pixel-padding nudge, which rounds differently per element. Do NOT use this
   family for body text (it changes line spacing). */
@font-face {
    font-display: swap;
    font-family: 'Overpass Badge';
    font-style: normal;
    font-weight: 700;
    src: url(/assets/Overpass-latin-Bold-128ea00ceb02e0ea518c614721cd9cc84de114cc480b79b68bed9baeeca11d00.woff2) format('woff2-variations');
    unicode-range: U+0020-007F, U+00A0-00FF;
    ascent-override: 86%;
    descent-override: 14%;
}
main[data-controller~="meetings"] {
    display: grid;
    grid-auto-flow: row dense;
    grid-gap: 2.5rem;
    grid-template-columns: 2fr 1fr;
}
main[data-controller~="meetings"] section {
    grid-column: 1;
}
.monthly_startup_card {
    height: 100px;
    background-color: white;
    margin-left: 20px;
    margin-right: 20px;
    margin-top: 20px;
    margin-bottom: 20px;
    display: flex;
    border-bottom-left-radius: 15px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    box-shadow: 0 1px 2px #bab8b6, 0 -1px 1px #cfcbc8;
    cursor: pointer;
}

.monthly_startup_card.resized {
    height: 300px;
}

.monthly_startup_card:hover {
    background-color: #f5f5f5;
}

.monthly_startup_card_logo {
    width: 100px;
    border-right: 1px solid #ebebeb;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 5px;
    padding-right: 5px;
}

.monthly_startup_card img {
    max-width: 100px;
    height: min-content;
}

.monthly_startup_card .card_body {
    flex: 1;
    display: flex;
}

.monthly_startup_card .card_top {
    margin: 10px;
}

.monthly_startup_card_top .monthly_startup_card_name {
    font-size: 24px;
}

.monthly_startup_card_middle {
    flex: 5
}

.monthly_startup_card_right {
    flex: 1;
    border-left: 1px solid #ebebeb;
    padding: 5px;
}

.monthly_startup_card_header {
    font-size: 18px;
    font-weight: 700;
    margin-top: 10px;
}

main[data-controller~="partner-responses"] {
    display: grid;
    grid-auto-flow: row dense;
    grid-gap: 2.5rem;
    grid-template-columns: 2fr 1fr;
}
main[data-controller~="partner-responses"] section {
    grid-column: 1;
}
main[data-controller~="partner-organizations"] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* 4-column grid for info sections (Stagegates, Categories, Users, Files).
   Boxes stretch to equal height; each box's list scrolls at a fixed max-height
   so no single box can grow unbounded and drag the row taller. */
.partner-org-info-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
}

/* Full-width Platforms bar below the 4 info boxes: horizontal, wrapping cards
   that span the page width (like the startups pipeline). */
.partner-org-platforms-bar {
    background: #f8fafc;
    border-radius: 8px;
    padding: 1rem;
    border: 1px solid #e5e7eb;
}

.partner-org-platforms-bar .platform-list {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.partner-org-platforms-bar .embedded-platform {
    flex: 1 1 220px;
    max-width: 320px;
}

.partner-org-info-section {
    min-width: 0; /* Allow grid item to shrink */
    background: #f8fafc;
    border-radius: 8px;
    padding: 1rem;
    border: 1px solid #e5e7eb;
    /* Flex column with a comfortable card height so the inner list can grow to
       fill the box (and only scroll past it) instead of capping early. */
    display: flex;
    flex-direction: column;
    min-height: 375px;
}

.partner-org-info-section .section__header {
    margin-bottom: 0.75rem;
}

.partner-org-info-section .section__header h2 {
    font-size: 1rem;
    margin: 0;
}

.partner-org-info-section .construct-list {
    margin: 0;
    padding: 0;
    /* Fill the remaining box height (flex-basis 0 so a long list doesn't grow
       the box past its set height) and scroll only when content overflows. */
    flex: 1 1 0;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
}

/* Categories box: the manager fills the box, its list flexing between the fixed
   toggle (top) and add row (bottom). */
.partner-org-info-section .sg-categories {
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
}
.partner-org-info-section .sg-cat-list {
    flex: 1 1 0;
    min-height: 0;
    max-height: none;
}

/* Compact user cards for the narrow info section */
.partner-org-info-section .embedded-user {
    display: grid;
    grid-template-columns: 24px 1fr auto;
    grid-template-rows: auto auto;
    align-items: center;
    gap: 0.3rem 0.4rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid #eee;
}

.partner-org-info-section .embedded-user:last-child {
    border-bottom: none;
}

.partner-org-info-section .embedded-user .u-photo {
    width: 24px;
    height: 24px;
    grid-row: 1;
    grid-column: 1;
}

.partner-org-info-section .embedded-user .p-email {
    font-size: 0.8rem;
    word-break: break-all;
    min-width: 0;
    grid-row: 1;
    grid-column: 2;
}

.partner-org-info-section .embedded-user .p-email:nth-of-type(2) {
    font-size: 0.7rem;
    color: #888;
    grid-row: 2;
    grid-column: 2 / 4;
}

.partner-org-info-section .embedded-user popover-toggle,
.partner-org-info-section .embedded-user a[data-turbo-method="delete"] {
    grid-row: 1;
    grid-column: 3;
    justify-self: end;
}

/* User settings popups use fixed positioning to escape scrollable container */
.partner-org-info-section .embedded-user popover-toggle details[open] .details__liner {
    position: fixed;
    z-index: 9999;
    background: white;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    padding: 0.5rem;
    min-width: 120px;
}

/* Pipeline container on partner organization page - full width */
/* Ensure stable container width before JS calculates column sizes */
.partner-org-startups-section {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    contain: layout; /* CSS containment for better performance - browser knows this section's layout is independent */
}

.partner-org-pipeline {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    min-height: 450px; /* Reserve space to prevent collapse during load */
}

.partner-org-pipeline .pipeline-full-width {
    width: 100%;
    max-width: 100%;
}

.partner-org-pipeline .pipeline-container {
    width: 100%;
    max-width: 100%;
    min-height: 400px; /* Match .pipeline-column-content min-height */
}

.partner-org-pipeline .pipeline-content {
    width: 100%;
    max-width: 100%;
}

/* Ensure pipeline headers and columns use inline-flex to size to content and stay aligned */
.partner-org-pipeline .pipeline-headers {
    display: inline-flex;
    min-width: 100%;
}

.partner-org-pipeline .pipeline-columns {
    display: inline-flex;
    min-width: 100%;
}

/* Admin settings popup on partner organization page */
.partner_organizations.page-header {
    overflow: visible;
    position: relative;
}

.partner_organizations.page-header .admin-controls {
    grid-area: actions;
    justify-self: end;
    align-self: start;
}

.partner_organizations.page-header .admin-controls popover-toggle {
    position: relative;
}

/* ── Organization edit page layout ── */

.org-edit-layout {
    display: grid;
    grid-template-columns: 3fr 1fr;
    gap: 1.5rem;
    align-items: start;
}

.org-edit-layout__main {
    min-width: 0;
}

.org-edit-layout__sidebar {
    position: sticky;
    top: 5rem;
}

@media (max-width: 800px) {
    .org-edit-layout {
        grid-template-columns: 1fr;
    }
    .org-edit-layout__sidebar {
        position: static;
    }
}

/* ── Edit page cards ── */

.org-edit-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    margin-bottom: 1.5rem;
    overflow: hidden;
}

.org-edit-card--personal {
    border-style: dashed;
    background: var(--gray-lightest);
}

.org-edit-card__header {
    background: #f8fafc;
    border-bottom: 1px solid #e5e7eb;
    padding: 0.75rem 1.25rem;
}

.org-edit-card--personal .org-edit-card__header {
    background: transparent;
    border-bottom: 1px dashed #e5e7eb;
}

.org-edit-card__header h2 {
    font-size: 0.875rem;
    margin: 0;
    letter-spacing: 0.04em;
}

.org-edit-card__subtitle {
    display: block;
    font-size: 0.8rem;
    font-weight: 300;
    color: var(--gray-light);
    text-transform: none;
    letter-spacing: normal;
    margin-top: 0.15rem;
}

/* ── Card body and field overrides ── */

.org-edit-card__body {
    padding: 1.25rem;
}

/* Reset the base .field and .field + .field margins inside cards
   so grid gap is the only spacing source in multi-col rows */
.org-edit-card__body .field {
    margin: 0 0 1rem;
}

.org-edit-card__body .field + .field {
    margin-top: 0;
}

.org-edit-card__body .field:last-child {
    margin-bottom: 0;
}

.org-edit-card__body .field > label {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--gray-dark);
    margin-bottom: 0.35rem;
}

.org-edit-card__body input[type="text"],
.org-edit-card__body textarea,
.org-edit-card__body select {
    width: 100%;
}

.org-edit-card__body .field--checkbox {
    margin-bottom: 0.25rem;
}

.org-edit-card__body .field--checkbox label {
    font-size: 0.875rem;
    font-weight: 400;
}

.org-edit-hint {
    font-size: 0.75rem;
    font-weight: 300;
    color: var(--gray-light);
    margin: 0 0 1rem;
    line-height: 1.4;
}

.org-edit-hint:last-child {
    margin-bottom: 0;
}

/* ── Grid rows ── */

.org-edit-row--two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

.org-edit-row--two-col:last-child {
    margin-bottom: 0;
}

/* Fields inside grid rows should not add their own bottom margin */
.org-edit-row--two-col > .field {
    margin-bottom: 0;
}

.org-edit-row--label-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

/* Fields inside label grid should not add their own bottom margin */
.org-edit-row--label-grid > .field {
    margin-bottom: 0;
}

@media (max-width: 640px) {
    .org-edit-row--two-col,
    .org-edit-row--label-grid {
        grid-template-columns: 1fr;
    }
}

/* ── Actions & save ── */

.org-edit-actions {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    margin-bottom: 2rem;
}

.org-edit-actions .button--primary {
    background: var(--accent-darker);
    border-color: var(--accent-darker);
    color: #fff;
}

.org-edit-actions .button--primary:hover {
    filter: brightness(0.9);
}

.org-edit-save-status {
    font-size: 0.8rem;
    font-weight: 600;
    margin-left: 0.25rem;
}

.org-edit-save-status--success {
    color: #059669;
}

.org-edit-save-status--error {
    color: #dc2626;
}

/* ── Delete link ── */

.org-edit-delete {
    margin-top: 0.5rem;
    padding-top: 1rem;
    border-top: 1px solid #e5e7eb;
}

.org-edit-delete a {
    font-size: 0.8rem;
    color: var(--gray-light);
    text-decoration: none;
}

.org-edit-delete a:hover {
    color: var(--danger-darker);
}

/* Button outline style for secondary actions */
.button--outline {
    background: transparent;
    border: 1px solid currentColor;
    color: var(--accent-darker, #2563eb);
    transition: all 0.15s ease;
}

.button--outline:hover {
    background: rgba(0, 0, 0, 0.05);
    transform: translateY(-1px);
}

.button--outline:active {
    transform: translateY(0);
}

main[data-controller~="platforms"] {
    display: grid;
    grid-auto-flow: row dense;
    grid-gap: 2.5rem;
    grid-template-columns: 2fr 1fr;
}
main[data-controller~="platforms"] section {
    grid-column: 1;
}

/* Settings page — single-column so the proposal-questions editor and
   platform-tags blocks span the full width. Wider than the base 90rem main
   cap, but centered with generous side gutters (padding, so they hold even
   below the cap where the auto margins collapse to 0). */
main[data-controller~="platforms"][data-action~="settings"] {
    grid-template-columns: 1fr;
    max-width: 104rem;
    margin: 3.75rem auto 1.875rem;
    padding-left: 4rem;
    padding-right: 4rem;
}
main[data-controller~="platforms"][data-action~="settings"] section {
    grid-column: 1;
}

/* Settings page — partner org list */
.settings-partner-list {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.settings-partner-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid var(--gray-lightest, #f3f4f6);
}

.settings-partner-item:last-child {
    border-bottom: none;
}

.settings-partner-item__logo {
    width: 28px;
    height: 28px;
    border-radius: 4px;
    object-fit: contain;
    flex-shrink: 0;
    background: var(--gray-lightest, #f9fafb);
}

.settings-partner-item__name {
    flex: 1;
    min-width: 0;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--gray-dark, #1f2937);
    line-height: 1.3;
}

.settings-partner-item__remove {
    background: none;
    border: none;
    font-size: 0.6875rem;
    color: var(--gray-light, #9ca3af);
    cursor: pointer;
    padding: 0.25rem 0.375rem;
    border-radius: 4px;
    transition: color 0.15s ease, background 0.15s ease;
    flex-shrink: 0;
}

.settings-partner-item__remove:hover {
    color: #dc2626;
    background: #fef2f2;
}
popover-toggle-hover {
    position: relative;
    align-self: center;
}
popover-toggle-hover summary {
    align-items: center;
    align-self: center;
    color: var(--accent-darker);
    display: flex;
    font-size: 0.875rem;
    font-weight: 700;
    justify-self: end;
    text-decoration: none;
    text-transform: uppercase;
    width: auto;
}
popover-toggle-hover summary svg {
    margin-left: auto;
}
popover-toggle-hover summary::before {
    content: none;
}
popover-toggle-hover summary::-webkit-details-marker {
    display: none;
}
popover-toggle-hover .details__liner {
    background: var(--popover-background, #fff);
    border-radius: 0.5rem;
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,0.5);
    padding: var(--popover-padding, 0.625rem);
    position: absolute;
    right: 0;
    z-index: 1;
    width: auto;
}

popover-toggle-hover .details__liner > a {
    align-self: center;
    font-size: 0.875rem;
    font-weight: 700;
    justify-self: end;
    text-decoration: none;
    text-transform: uppercase;
}


popover-toggle-hover .details__liner label {
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}
popover-toggle-hover .details__liner .button--text {
    text-align: right;
}


popover-toggle-hover .form__liner {
    background: var(--popover-background, #fff);
    border-radius: 0.5rem;
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,0.5);
    padding: var(--popover-padding, 0.625rem);
    position: absolute;
    z-index: 1;
    max-width: 100%;
}

popover-toggle-hover .form__liner > a {
    align-self: center;
    font-size: 0.875rem;
    font-weight: 700;
    justify-self: end;
    text-decoration: none;
    text-transform: uppercase;
}


popover-toggle-hover .form__liner label {
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}
popover-toggle-hover .form__liner .button--text {
    text-align: right;
}

popover-toggle-hover details {
    position: relative;
    display: inline-block;
}

popover-toggle-hover details[open] .form__liner {
    position: absolute;
    background-color: white;
    border: 1px solid #ddd;
    padding: 1rem;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    min-width: 300px; /* Set a minimum width for the popover */
    max-width: 600px; /* Limit the maximum width so it doesn't get too wide */
    width: auto; /* Let the width grow based on content */
    z-index: 10;
}

popover-toggle-hover details summary {
    cursor: pointer;
    list-style: none; /* Remove default triangle */
    display: flex;
    align-items: center;
}

.form__liner div {
    word-wrap: break-word; /* Ensure long words wrap properly */
    max-width: 100%; /* Prevent overflow */
}
popover-toggle {
    position: relative;
    align-self: center;
}
popover-toggle summary {
    align-items: center;
    align-self: center;
    color: var(--accent-darker);
    display: flex;
    font-size: 0.875rem;
    font-weight: 700;
    justify-self: end;
    text-decoration: none;
    text-transform: uppercase;
}
popover-toggle summary svg {
    margin-left: auto;
}
popover-toggle summary::before {
    content: none;
}
popover-toggle summary::-webkit-details-marker {
    display: none;
}
popover-toggle .details__liner {
    background: var(--popover-background, #fff);
    border-radius: 0.5rem;
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,0.5);
    padding: var(--popover-padding, 0.625rem);
    position: absolute;
    right: 0;
    z-index: 1;
    width: auto;
}

popover-toggle .details__liner > a {
    align-self: center;
    font-size: 0.875rem;
    font-weight: 700;
    justify-self: end;
    text-decoration: none;
    text-transform: uppercase;
}


popover-toggle .details__liner label {
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}
popover-toggle .details__liner .button--text {
    text-align: right;
}

/* Wider popover variant for forms with multiple controls */
popover-toggle .details__liner--wide {
    min-width: 300px;
    padding: 1rem 1.25rem;
}

popover-toggle .details__liner--wide fieldset {
    border: none;
    padding: 0;
    margin: 0 0 0.75rem 0;
}

popover-toggle .details__liner--wide legend {
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--gray-light, #6b7280);
    margin-bottom: 0.5rem;
}

popover-toggle .details__liner--wide .radio-group {
    display: flex;
    gap: 0;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    overflow: hidden;
}

popover-toggle .details__liner--wide .radio-group label {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 0.4rem 0.75rem;
    cursor: pointer;
    font-size: 0.8rem;
    font-weight: 600;
    transition: background-color 0.15s ease, color 0.15s ease;
    border-right: 1px solid #d1d5db;
    margin: 0;
}

popover-toggle .details__liner--wide .radio-group label:last-child {
    border-right: none;
}

popover-toggle .details__liner--wide .radio-group label:has(input:checked) {
    background-color: var(--accent-base, #3b82f6);
    color: #fff;
}

popover-toggle .details__liner--wide .radio-group label input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    opacity: 0;
}

popover-toggle .details__liner--wide .form-group label {
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--gray-light, #6b7280);
    display: block;
    margin-bottom: 0.35rem;
}

popover-toggle .popover-divider {
    border: none;
    border-top: 1px solid #e5e7eb;
    margin: 0.75rem 0;
}

popover-toggle .popover-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

popover-toggle .popover-actions .btn {
    flex: 1;
    text-align: center;
}

popover-toggle .popover-actions .button--text {
    color: #dc2626;
    font-size: 0.8rem;
}

/* Read-only visibility badge for partner users */
popover-toggle .visibility-badge {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.2rem 0.5rem;
    border-radius: 0.25rem;
    margin-bottom: 0.5rem;
}

popover-toggle .visibility-badge--public {
    background-color: #dcfce7;
    color: #166534;
}

popover-toggle .visibility-badge--private {
    background-color: #fef3c7;
    color: #92400e;
}

popover-toggle .form__liner {
    background: var(--popover-background, #fff);
    border-radius: 0.5rem;
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,0.5);
    padding: var(--popover-padding, 0.625rem);
    position: absolute;
    right: 0;
    z-index: 1;
    width: 200px;
}

popover-toggle .form__liner > a {
    align-self: center;
    font-size: 0.875rem;
    font-weight: 700;
    justify-self: end;
    text-decoration: none;
    text-transform: uppercase;
}


popover-toggle .form__liner label {
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}
popover-toggle .form__liner .button--text {
    text-align: right;
}

/* ==========================================================================
   Popover API Styles (for pipeline contexts)
   The native Popover API renders in the top layer, automatically escaping
   overflow clipping from parent containers.
   ========================================================================== */

/* Popover trigger button */
popover-toggle .popover-trigger {
    background: none;
    border: none;
    padding: 0.25rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--accent-darker);
    border-radius: 4px;
    transition: background-color 0.15s ease;
}

popover-toggle .popover-trigger:hover {
    background-color: rgba(0, 0, 0, 0.05);
}

popover-toggle .popover-trigger:focus-visible {
    outline: 2px solid var(--accent-base, #3b82f6);
    outline-offset: 2px;
}

/* Native popover element styling */
popover-toggle [popover] {
    /* Reset browser defaults */
    border: none;
    margin: 0;
    overflow: visible;

    /* Styling */
    background: var(--popover-background, #fff);
    border-radius: 0.5rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    padding: var(--popover-padding, 0.625rem);
    min-width: 200px;
    max-height: 80vh;
    overflow-y: auto;
}

/* Remove popover backdrop dimming */
popover-toggle [popover]::backdrop {
    background: transparent;
    opacity: 0;
}

/* Also target the popover directly in case browser applies default backdrop */
[popover]::backdrop {
    background: transparent !important;
    opacity: 0 !important;
}

/* Links inside popover */
popover-toggle [popover] a {
    align-self: center;
    font-size: 0.875rem;
    font-weight: 700;
    justify-self: end;
    text-decoration: none;
    text-transform: uppercase;
}

/* Labels inside popover */
popover-toggle [popover] label {
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}

/* Button text styling */
popover-toggle [popover] .button--text {
    text-align: right;
}
main[data-controller~="projects"] {
    display: grid;
    grid-auto-flow: row dense;
    grid-gap: 2.5rem;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: masonry;
}

.project_form {
    grid-column: 1;
}
.project_form textarea {
    max-width: 100%;
    min-height: 10rem;
    resize: vertical;
    width: 100%;
}
.project_form > .field:first-of-type {
    margin-top: 0;
}
main[data-controller~="scouting-priorities"][data-action~="new"],
main[data-controller~="scouting-priorities"][data-action~="edit"] {
    display: grid;
    grid-auto-flow: row dense;
    grid-gap: 2.5rem;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: masonry;
}
main[data-controller~="scouting-priorities"][data-action~="show"] {
    align-items: start;
    display: grid;
    grid-auto-flow: row dense;
    grid-gap: 2.5rem;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: masonry;
}

.select2-container--seamless .select2-selection--single {
    background: linear-gradient(to bottom, #fdfdfd, #e5e5e5);
    border: solid 1px var(--gray-light);
    border-radius: 0.25rem;
    color: var(--gray-light);
    display: block;
    font-size: 0.875rem;
    font-weight: 700;
    height: calc(0.875rem * 1.375 + 1rem + 2px);
    letter-spacing: calc(-0.15 / 14 * 1em);
    line-height: 1.375;
    padding: 0.5rem 2rem 0.5rem 0.875rem;
    position: relative;
}
.select2-container--seamless .select2-selection--single .select2-selection__rendered {
    color: #444;
    padding: 0;
}
.select2-container--seamless .select2-selection--single .select2-selection__clear {
    cursor: pointer;
    float: right;
    font-weight: 700;
    height: 26px;
    margin-right: 20px;
    padding-right: 0px;
}
.select2-container--seamless .select2-selection--single .select2-selection__placeholder {
    color: #999;
}
.select2-container--seamless .select2-selection--single .select2-selection__arrow {
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 2rem;
}
.select2-container--seamless .select2-selection--single .select2-selection__arrow b {
    background: var(--select-arrow) no-repeat center center / 1rem 0.5rem;
    height: 100%;
    position: absolute;
    width: 100%;
}

.select2-container--seamless[dir="rtl"] .select2-selection--single .select2-selection__clear {
    float: left;
}

.select2-container--seamless[dir="rtl"] .select2-selection--single .select2-selection__arrow {
    left: 1px;
    right: auto;
}

.select2-container--seamless.select2-container--disabled .select2-selection--single {
    background-color: #eee;
    cursor: default;
}
.select2-container--seamless.select2-container--disabled .select2-selection--single .select2-selection__clear {
    display: none;
}

.select2-container--seamless.select2-container--open .select2-selection--single .select2-selection__arrow b {
    transform: scaleY(-1);
}


.select2-container--seamless .select2-selection--multiple {
    background-color: #fff;
    border: 1px solid #aaa;
    border-radius: 4px;
    cursor: text;
    padding-bottom: 5px;
    padding-right: 5px;
    position: relative;
}
.select2-container--seamless .select2-selection--multiple.select2-selection--clearable {
    padding-right: 25px;
}
.select2-container--seamless .select2-selection--multiple .select2-selection__clear {
    cursor: pointer;
    font-weight: 700;
    height: 20px;
    margin-right: 10px;
    margin-top: 5px;
    padding: 1px;
    position: absolute;
    right: 0;
}
.select2-container--seamless .select2-selection--multiple .select2-selection__choice {
    background-color: #e4e4e4;
    border: 1px solid #aaa;
    border-radius: 4px;
    box-sizing: border-box;
    display: inline-block;
    margin-left: 5px;
    margin-top: 5px;
    max-width: 100%;
    overflow: hidden;
    padding: 0;
    padding-left: 20px;
    position: relative;
    text-overflow: ellipsis;
    vertical-align: bottom;
    white-space: nowrap;
}
.select2-container--seamless .select2-selection--multiple .select2-selection__choice__display {
    cursor: default;
    padding-left: 2px;
    padding-right: 5px;
}
.select2-container--seamless .select2-selection--multiple .select2-selection__choice__remove {
    background-color: transparent;
    border: none;
    border-bottom-left-radius: 4px;
    border-right: 1px solid #aaa;
    border-top-left-radius: 4px;
    color: #999;
    cursor: pointer;
    font-size: 1em;
    font-weight: 700;
    left: 0;
    padding: 0 4px;
    position: absolute;
    top: 0;
}
.select2-container--seamless .select2-selection--multiple .select2-selection__choice__remove:hover,
.select2-container--seamless .select2-selection--multiple .select2-selection__choice__remove:focus {
    background-color: #f1f1f1;
    color: #333;
    outline: none;
}

.select2-container--seamless[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
    margin-left: 5px;
    margin-right: auto;
}

.select2-container--seamless[dir="rtl"] .select2-selection--multiple .select2-selection__choice__display {
    padding-left: 5px;
    padding-right: 2px;
}

.select2-container--seamless[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 4px;
    border-left: 1px solid #aaa;
    border-right: none;
    border-top-left-radius: 0;
    border-top-right-radius: 4px;
}

.select2-container--seamless[dir="rtl"] .select2-selection--multiple .select2-selection__clear {
    float: left;
    margin-left: 10px;
    margin-right: auto;
}

.select2-container--seamless.select2-container--focus .select2-selection--multiple {
    border: solid #000 1px;
    outline: 0;
}

.select2-container--seamless.select2-container--disabled .select2-selection--multiple {
    background-color: #eee;
    cursor: default;
}

.select2-container--seamless.select2-container--disabled .select2-selection__choice__remove {
    display: none;
}

.select2-container--seamless.select2-container--open.select2-container--above .select2-selection--single,
.select2-container--seamless.select2-container--open.select2-container--above .select2-selection--multiple {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.select2-container--seamless.select2-container--open.select2-container--below .select2-selection--single,
.select2-container--seamless.select2-container--open.select2-container--below .select2-selection--multiple {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.select2-container--seamless .select2-search--dropdown .select2-search__field {
    border: 1px solid #aaa;
}

.select2-container--seamless .select2-search--inline .select2-search__field {
    -webkit-appearance: textfield;
    background: transparent;
    border: none;
    box-shadow: none;
    outline: 0;
}

.select2-container--seamless .select2-results > .select2-results__options {
    max-height: 200px;
    overflow-y: auto;
}

.select2-container--seamless .select2-results__option .select2-results__option {
    padding-left: 1em;
}
.select2-container--seamless .select2-results__option .select2-results__option .select2-results__group {
    padding-left: 0;
}
.select2-container--seamless .select2-results__option .select2-results__option .select2-results__option {
    margin-left: -1em;
    padding-left: 2em;
}
.select2-container--seamless .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
    margin-left: -2em;
    padding-left: 3em;
}
.select2-container--seamless .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
    margin-left: -3em;
    padding-left: 4em;
}
.select2-container--seamless .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
    margin-left: -4em;
    padding-left: 5em;
}
.select2-container--seamless .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
    margin-left: -5em;
    padding-left: 6em;
}

.select2-container--seamless .select2-results__option--group {
    padding: 0;
}

.select2-container--seamless .select2-results__option--disabled {
    color: #999;
}

.select2-container--seamless .select2-results__option--selected {
    background-color: #ddd;
}

.select2-container--seamless .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: #5897fb;
    color: #fff;
}

.select2-container--seamless .select2-results__group {
    cursor: default;
    display: block;
    padding: 6px;
}
/* ============================================================
   Platform Settings + FLITE Admin
   Moved out of the inline <style> blocks in platforms/settings.html.erb
   and platforms/flite_admin.html.erb. Exact-match grays/status colors use
   the shared FLITE tokens (identical hex — no visual change).
   ============================================================ */

/* ---- Page header sub (platform name under "Settings") ---- */
.settings-header-sub {
    display: block;
    font-size: 0.8125rem;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
    color: var(--flite-muted);
    margin-top: 0.25rem;
}

/* ---- Settings accordion ---- */
.settings-accordion {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    margin-top: 1.25rem;
}
.settings-card {
    border: 1px solid var(--flite-line);
    border-radius: 10px;
    background: #fff;
    overflow: hidden;
}
/* Card header: title stacked over its description on the left, chevron
   centered on the right — a uniform two-line block for every section. */
.settings-card > summary {
    list-style: none;
    cursor: pointer;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    column-gap: 1rem;
    padding: 1rem 1.5rem;
    user-select: none;
}
.settings-card > summary::-webkit-details-marker { display: none; }
.settings-card > summary:hover { background: var(--flite-wash); }
.settings-card__title {
    grid-column: 1;
    font-weight: 600;
    font-size: 0.9375rem;
    color: #111827;
    letter-spacing: 0.01em;
}
.settings-card__sub {
    grid-column: 1;
    font-weight: 400;
    font-size: 0.8125rem;
    color: var(--flite-muted);
    margin-top: 0.125rem;
}
.settings-card__chevron {
    grid-column: 2;
    grid-row: 1 / span 2;
    color: var(--flite-faint);
    font-size: 0.7rem;
    transition: transform 0.15s ease;
}
.settings-card[open] > summary { border-bottom: 1px solid #f0f0f1; }
.settings-card[open] > summary .settings-card__chevron { transform: rotate(90deg); }
.settings-card__body { padding: 0.25rem 1.5rem 1rem; }
.settings-card--danger { border-color: #fecaca; background: #fff8f8; }

/* ---- The settings row: [title + description | control] ----
   Every setting is the same shape, on a shared vertical axis, with hairline
   dividers between rows. Controls are width-capped so they align in a column
   even when the page spans the full viewport. */
.settings-row {
    display: grid;
    grid-template-columns: minmax(200px, 300px) minmax(0, 1fr);
    gap: 0.5rem 3rem;
    padding: 1.25rem 0;
}
.settings-row + .settings-row { border-top: 1px solid #f0f0f1; }
.settings-row__head h3 {
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    color: #111827;
    margin: 0 0 0.375rem;
}
.settings-row__desc {
    color: var(--flite-muted);
    font-size: 0.8125rem;
    line-height: 1.55;
    margin: 0;
}
.settings-row__desc + .settings-row__desc { margin-top: 0.5rem; }
.settings-row__control { min-width: 0; }
/* Wide-control variant (the question editor): head on top, control spans
   the full card width below. */
.settings-row--stacked { grid-template-columns: 1fr; gap: 0.75rem 0; }
@media (max-width: 800px) {
    .settings-row { grid-template-columns: 1fr; gap: 0.75rem 0; }
}

/* ---- Form-control calm (scoped to the settings page) ----
   Quiet the heavy base form styles: smaller ink labels, flat white selects
   (no gradient pill), consistent sizes, capped control widths. */
.settings-accordion .field { margin: 0 0 0.875rem; }
.settings-accordion .field:last-child { margin-bottom: 0; }
.settings-accordion .field > label,
.settings-accordion .field label:first-child {
    display: block;
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: 0;
    color: var(--flite-ink);
    margin-bottom: 0.375rem;
}
.settings-accordion select {
    appearance: none;
    background: #fff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="13" height="8"><path fill="%236b7280" fill-rule="evenodd" d="m7.01 7.222 5.19-5.538A1 1 0 0 0 11.472 0H1.088a1 1 0 0 0-.73 1.684L5.55 7.222a1 1 0 0 0 1.46 0Z"/></svg>') no-repeat right 0.65rem center / 0.7rem 0.45rem;
    border: 1px solid var(--flite-line);
    border-radius: 6px;
    color: var(--flite-text);
    font-size: 0.875rem;
    font-weight: 500;
    letter-spacing: 0;
    padding: 0.45rem 2rem 0.45rem 0.65rem;
}
.settings-accordion select[multiple] {
    background-image: none;
    padding: 0.45rem 0.65rem;
}
.settings-accordion select:disabled {
    background-color: var(--flite-wash);
    background-image: none;
    color: var(--flite-muted);
    border-color: var(--flite-line);
}
.settings-accordion .field > input[type="text"],
.settings-accordion .field > select,
.settings-accordion .field input[type="text"],
.settings-accordion .field select {
    width: 100%;
    max-width: 26rem;
}
.settings-accordion .field input[type="text"] {
    font-size: 0.875rem;
    padding: 0.45rem 0.65rem;
    border: 1px solid var(--flite-line);
    border-radius: 6px;
}
.settings-accordion textarea {
    box-shadow: none;
    border: 1px solid var(--flite-line);
    border-radius: 6px;
    font-size: 0.875rem;
    max-width: 34rem;
}
/* Checkbox rows: inline normal-weight label beside the box. */
.settings-accordion .field--check { margin-bottom: 0.625rem; }
.settings-accordion .field--check label {
    display: inline;
    font-size: 0.875rem;
    font-weight: 400;
    color: var(--flite-text);
    margin: 0;
}
.settings-accordion .actions { margin-top: 0.875rem; }

/* ---- FLITE Admin tables + badges + action buttons ---- */
.admin-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8125rem;
}
.admin-table th {
    text-align: left;
    padding: 0.5rem 0.75rem;
    background: var(--flite-wash);
    border-bottom: 2px solid var(--flite-line);
    font-weight: 600;
    color: var(--flite-text);
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}
.admin-table td {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid #f3f4f6;
    color: var(--flite-ink);
}
.admin-table tbody tr:hover { background: var(--flite-wash); }

.admin-badge {
    display: inline-block;
    font-size: 0.625rem;
    font-weight: 600;
    padding: 0.125rem 0.375rem;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.admin-badge--warning { background: var(--flite-status-warn-bg); color: var(--flite-status-warn-fg); }
.admin-badge--info { background: #dbeafe; color: #1e40af; }

.admin-delete-btn {
    background: none;
    border: 1px solid var(--flite-err);
    color: var(--flite-err);
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
}
.admin-delete-btn:hover { background: var(--flite-err); color: #fff; }

/* Assign (green) / Reject (red) / Remove (gray) action buttons */
.admin-action-btn--success {
    background: none;
    border: 1px solid var(--flite-ok);
    color: var(--flite-ok);
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
}
.admin-action-btn--success:hover { background: var(--flite-ok); color: #fff; }
.admin-action-btn--danger {
    background: none;
    border: 1px solid var(--flite-err);
    color: var(--flite-err);
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
}
.admin-action-btn--danger:hover { background: var(--flite-err); color: #fff; }
.admin-action-btn--neutral {
    background: none;
    border: 1px solid var(--flite-muted);
    color: var(--flite-muted);
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
}
.admin-action-btn--neutral:hover { background: var(--flite-muted); color: #fff; }

/* ============================================================
   Sweep: classes replacing inline styles in settings.html.erb +
   _flite_question_section_editor.html.erb (no visual change).
   ============================================================ */

/* Inline checkbox field row. */
.field--check { display: flex; align-items: center; gap: 0.5rem; }
/* Field with a bit of bottom breathing room (branding toggles). */
.field--spaced { margin-bottom: 1rem; }

/* Help / hint text. */
.settings-hint { color: var(--flite-muted); font-size: 0.8125rem; margin-top: 0.375rem; }
.settings-hint--tiny { color: var(--flite-faint); font-size: 0.75rem; margin-top: 0.25rem; }

/* Logo preview row (Name & Type). */
.settings-logo-preview {
    margin: 0.5rem 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.settings-logo-preview__img { max-height: 60px; max-width: 240px; }
.settings-logo-preview__remove {
    font-size: 0.8125rem;
    color: var(--flite-text);
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-weight: normal;
}

/* Partner-org list: cap so the Remove action stays beside the org name
   instead of drifting to the far page edge in the full-width control cell. */
.settings-accordion .settings-partner-list { max-width: 26rem; }

/* "+ Add organization" popover summary. */
.settings-add-org-summary {
    font-size: 0.8125rem;
    cursor: pointer;
    color: var(--accent-darker);
    justify-self: start;
}
.settings-add-org {
    margin-top: 0.75rem;
    max-width: 26rem;
}

/* Multi-select for hidden reviewer categories. */
.settings-multiselect { width: 100%; max-width: 26rem; }

/* Admin-notification recipients textarea. */
.settings-recipients {
    width: 100%;
    font-family: ui-monospace, SFMono-Regular, monospace;
    font-size: 0.85rem;
}

/* Add-section row (Application Questions). */
.settings-add-section {
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid var(--flite-line);
}
.settings-add-section__form { display: flex; gap: 0.75rem; align-items: center; }
.settings-add-section__input { flex: 1; max-width: 300px; }

/* Danger-zone delete link. */
.settings-danger-link { color: var(--flite-err); font-weight: 600; }

/* Tag manager (Tags card). */
.platform-tags-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}
.platform-tag-manager {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.625rem;
    border: 1px solid var(--flite-line);
    border-radius: 6px;
    background: #fff;
}
.platform-tag-manager__color {
    width: 20px;
    height: 20px;
    border: none;
    cursor: pointer;
    padding: 0;
}
.platform-tag-manager__delete {
    background: none;
    border: none;
    color: var(--flite-faint);
    cursor: pointer;
    font-size: 1rem;
    padding: 0 0.25rem;
    line-height: 1;
}
.platform-tag-add { display: flex; gap: 0.5rem; align-items: center; }
.platform-tag-add__name {
    font-size: 0.8125rem;
    padding: 0.375rem 0.5rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    width: 180px;
}
.platform-tag-add__color {
    width: 32px;
    height: 32px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    cursor: pointer;
    padding: 0;
}
.platform-tag-status { font-size: 0.75rem; }

/* Question editor: section-title row, system tag, add-question row, Core toggle. */
.flite-section-editor-head {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}
.flite-section-system-tag {
    font-size: 0.7rem;
    color: var(--flite-muted);
    padding: 0.2rem 0.5rem;
    background: #f3f4f6;
    border-radius: 4px;
}
.flite-question-editor-actions {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    margin-top: 0.75rem;
}
/* Core toggle — its own class (was reusing __required); lets it be zoned apart. */
.flite-question-row__core { color: var(--accent-darker); }

/* ---- FLITE Admin page section chrome (replaces inline styles) ---- */
.admin-page { padding: 0 1rem; }
.admin-section { margin-bottom: 2rem; }
.admin-section__head {
    font-size: 1rem;
    border-bottom: 2px solid var(--flite-line);
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
}
.admin-section__head--info { border-bottom-color: #2563eb; }
.admin-section__head--warn { border-bottom-color: #f59e0b; }
.admin-section__head--danger { border-bottom-color: var(--flite-err); }
.admin-section__head--accent { border-bottom-color: var(--accent-base, #6fc4cb); }
.admin-section__count { font-weight: normal; font-size: 0.8rem; color: var(--flite-muted); }
.admin-section__desc { color: var(--flite-muted); font-size: 0.8125rem; margin-bottom: 0.75rem; }
.admin-empty { color: var(--flite-ok); font-size: 0.875rem; }
.admin-actions { display: flex; gap: 0.5rem; }
.admin-badges { display: flex; flex-wrap: wrap; gap: 0.25rem; }
.admin-cell--muted { color: var(--flite-muted); }
.admin-cell--ink { color: #111827; }
.admin-none { color: var(--flite-faint); }
.admin-note { font-size: 0.7rem; color: var(--flite-muted); display: block; }
.admin-thumb { max-height: 40px; max-width: 120px; border-radius: 4px; }

/* Pending-review card. */
.admin-pending-review {
    border: 1px solid var(--flite-line);
    border-radius: 6px;
    padding: 1rem;
    margin-bottom: 1rem;
    background: #fafbfc;
}
.admin-pending-review__head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.admin-pending-review__name { font-size: 0.95rem; }
.admin-pending-review__meta { color: var(--flite-muted); font-size: 0.8rem; }
.admin-table--spaced { margin-bottom: 0.75rem; }
.admin-th-check { width: 1.5rem; }
.admin-field-label { font-weight: 600; }
.admin-row--dim { opacity: 0.5; }
.admin-empty--muted { color: var(--flite-muted); font-size: 0.875rem; }

/* ============================================================
   Question-editor calm — the editor's own compact selects keep
   their fixed widths (mapping/type/slide config line); the flat
   white select treatment comes from the .settings-accordion
   rules above. CSS-only: all class hooks are JS-pinned.
   ============================================================ */
.settings-accordion .flite-questions-editor select {
    font-size: 0.8125rem;
    padding: 0.35rem 1.75rem 0.35rem 0.5rem;
    width: auto;
    max-width: none;
}
.settings-accordion .flite-questions-editor .flite-question-row__mapping { max-width: 15rem; }
.settings-accordion .flite-questions-editor .flite-question-row__type { width: 120px; }
.settings-accordion .flite-questions-editor .flite-question-row__slide-select { max-width: 11rem; }
.settings-accordion .flite-questions-editor .flite-question-row__follow-up-type { width: 130px; }
main[data-controller~="stagegates"][data-action~="new"],
main[data-controller~="stagegates"][data-action~="edit"] {
    display: grid;
    grid-auto-flow: row dense;
    grid-gap: 2.5rem;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: masonry;
}
main[data-controller~="stagegates"][data-action~="show"] {
    align-items: start;
    display: grid;
    grid-auto-flow: row dense;
    grid-gap: 2.5rem;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: masonry;
}

.stagegate__controls {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.stagegate__control {
    text-decoration: none; /* Removes the underline */
}

.stagegate__control--up {
    /* Additional styles for the up button if needed */
}

.stagegate__control--down {
    /* Additional styles for the down button if needed */
}


.partner__stagegates {
    display: grid;
    grid-gap: 2rem 1.25rem;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    justify-content: start;
    scroll-margin-top: 8rem;
}

.partner__stagegates .details__liner {
    width: 12rem;
}

.partner__stagegates .details__liner select {
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
}

.partner__stagegates .details__liner .button--danger {
    margin-top: 1.25rem;
}

@media (min-width: 65rem) {
    .partner__stagegates {
        grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    }
}

@media (min-width: 93.75rem) {
    .partner__stagegates {
        grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    }
}
.timestamps {
    align-self: start;
    display: flex;
    gap: 0 1.75rem;
    justify-self: end;
}
.timestamp {
    color: var(--gray-light);
    font-size: 0.875rem;
    white-space: nowrap;
}
.startup_profile a {
    justify-self: start;
}

.startup_attributes {
    display: grid;
    gap: 0.625rem 2.5rem;
    grid-template-columns: 1fr 1fr;
    justify-content: start;
    margin: 0 0 1.25rem;
    padding: 0.625rem 0;
}
.startup_attribute--wide {
    grid-column-end: span 2;
}
.startup_attribute dd,
.startup_attribute dt {
    margin: 0;
}
.startup_attribute dd {
    font-size: 0.875rem;
    font-weight: 300;
    letter-spacing: calc(-0.15 / 14 * 1em);
    line-height: calc(8 / 7);
}
.startup_attribute dt {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: calc(-0.13 / 12 * 1em);
    line-height: 1.25;
}


.more-options-container {
    display: none;
}

.more-options-container.show {
    display: block;
}

.startup_funding_event {
    display: flex;
    flex-direction: row;
}

.startup_funding_event_details {
    flex: 1
}

.main__liner {
    align-items: start;
    /*display: grid;*/
    /*grid-auto-flow: row dense;*/
    grid-column: 2;
    grid-gap: 2.5rem;
}
.main__liner--wide {
    grid-column: 1;
    grid-template-columns: 1fr 1fr;
}


#startup_summary,
#tasks {
    grid-column-end: span 2;
}
#startup_website_image {
    grid-column: 1;
    grid-column-end: span 2;
}
#startup_website_image img {
    /*max-height: 500px;*/
    max-width: 100%;
}
#startup_profile_projects {
    grid-column: 2;
}


.right-side {
    grid-area: actions;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-items: flex-end;
}

.request_deck_form {
    text-align: right;
}

.request_deck_form .form-group {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

.request_deck_form label {
    font-size: 0.875rem;
    color: var(--gray-light);
    display: block;
    margin-bottom: 0.5rem;
    font-weight: normal;
    text-align: right;
}

.request_deck_form .form-control {
    font-size: 0.875rem;
    padding: 0.375rem 0.75rem;
    width: auto;  /* This allows the select to size to its content */
    display: inline-block;  /* This helps with the right alignment */
    margin-left: auto;  /* Pushes the select to the right */
}

.request_deck_form .btn {
    display: block;
    margin-left: auto;  /* Pushes the button to the right */
}

.request_deck_container {
    display: flex;
    gap: 0 1.75rem;
    justify-self: end;
}

/* Pipeline History Section */
.pipeline-history {
    grid-column: 1 / -1;
    margin-top: 2rem;
}

/* Pipeline Tabs */
.pipeline-tabs__nav {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
    border-bottom: 1px solid var(--gray-lighter, #e5e5e5);
    padding-bottom: 0.5rem;
}

.pipeline-tabs__tab {
    padding: 0.5rem 1rem;
    border: 1px solid var(--gray-lighter, #e5e5e5);
    border-radius: 4px;
    background: white;
    cursor: pointer;
    font-size: 0.875rem;
    color: var(--gray, #666);
    transition: all 0.15s ease;
}

.pipeline-tabs__tab:hover {
    background: var(--gray-lightest, #f5f5f5);
}

.pipeline-tabs__tab--active {
    background: var(--primary, #007bff);
    color: white;
    border-color: var(--primary, #007bff);
}

.pipeline-tabs__panel {
    display: block;
}

.pipeline-tabs__panel[hidden] {
    display: none;
}

/* Pipeline Timeline */
.pipeline-timeline {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
}

.pipeline-timeline::before {
    content: '';
    position: absolute;
    left: 8px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--gray-lighter, #e5e5e5);
}

.pipeline-event {
    display: flex;
    gap: 1rem;
    padding: 1rem 0;
    position: relative;
}

.pipeline-event__marker {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--primary, #007bff);
    border: 3px solid white;
    box-shadow: 0 0 0 2px var(--gray-lighter, #e5e5e5);
    flex-shrink: 0;
    z-index: 1;
}

.pipeline-event__content {
    flex: 1;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--gray-lightest, #f0f0f0);
}

.pipeline-event:last-child .pipeline-event__content {
    border-bottom: none;
}

.pipeline-event__header {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 0.5rem;
}

.pipeline-event__badge {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    border-radius: 3px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.pipeline-event__badge--added {
    background: #d4edda;
    color: #155724;
}

.pipeline-event__badge--status_changed {
    background: #fff3cd;
    color: #856404;
}

.pipeline-event__badge--stagegate_entered {
    background: #cce5ff;
    color: #004085;
}

.pipeline-event__badge--stagegate_exited {
    background: #e2e3e5;
    color: #383d41;
}

.pipeline-event__badge--removed {
    background: #f8d7da;
    color: #721c24;
}

.pipeline-event__time {
    font-size: 0.75rem;
    color: var(--gray-light, #999);
}

.pipeline-event__description {
    margin: 0 0 0.5rem;
    font-size: 0.9375rem;
    color: var(--text, #333);
}

.pipeline-event__comment {
    margin: 0.5rem 0;
    padding: 0.5rem;
    background: var(--gray-lightest, #f8f9fa);
    border-radius: 4px;
    font-size: 0.875rem;
    color: var(--gray, #666);
}

.pipeline-event__meta {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    font-size: 0.75rem;
    color: var(--gray-light, #999);
}

.pipeline-event__meta span::before {
    content: '';
    display: inline-block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: currentColor;
    margin-right: 0.25rem;
    vertical-align: middle;
}

.pipeline-event__meta span:first-child::before {
    display: none;
}

.pipeline-empty {
    padding: 2rem;
    text-align: center;
    color: var(--gray-light, #999);
    font-style: italic;
}

.pipeline-event__delete {
    margin-left: auto;
    padding: 0.2rem 0.5rem;
    font-size: 0.7rem;
    background: #dc3545;
    color: white;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.15s ease;
}

.pipeline-event__delete:hover {
    opacity: 1;
    background: #c82333;
}

.pipeline-event__delete::before {
    display: none;
}
main[data-controller~="startups"][data-action~="new"],
main[data-controller~="startups"][data-action~="edit"] {
    display: grid;
    grid-auto-flow: row dense;
    grid-gap: 2.5rem;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: masonry;
}
main[data-controller~="startups"][data-action~="show"] {
    align-items: start;
    display: grid;
    grid-auto-flow: row dense;
    grid-gap: 2.5rem;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: masonry;
}


/* ===== Page header & toolbar ===== */

.startups-page .section__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
}
.startups-page .section__header h1 {
    margin: 0;
}
.startups-toolbar {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}


/* ===== Search bar ===== */

.startups-search {
    margin-bottom: 1rem;
}
.startups-search__bar {
    display: flex;
}
.startups-search__input {
    width: 100%;
    padding: 0.625rem 0.875rem;
    border: solid 2px var(--accent-base);
    border-radius: 4px;
    font-size: 0.9375rem;
    line-height: 1.4;
    outline: none;
    transition: border-color 0.15s;
}
.startups-search__input:focus {
    border-color: var(--accent-darker);
}
.startups-search__input::placeholder {
    color: var(--gray-lighter);
}
.startups-search__actions {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}


/* ===== Advanced filters panel ===== */

.startups-filters {
    margin-bottom: 1rem;
}
.startups-filters__toggle {
    cursor: pointer;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--accent-darker);
    letter-spacing: 0.02em;
    padding: 0.375rem 0;
    user-select: none;
    list-style: none;
}
.startups-filters__toggle::-webkit-details-marker {
    display: none;
}
.startups-filters__toggle::before {
    content: "\25B6";
    display: inline-block;
    margin-right: 0.375rem;
    font-size: 0.625rem;
    transition: transform 0.15s;
}
.startups-filters[open] > .startups-filters__toggle::before {
    transform: rotate(90deg);
}
.startups-filters__panel {
    padding: 1rem 0 0.25rem;
}
.startups-filters__row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1.25rem;
    margin-bottom: 0.75rem;
}
.startups-filters__row > .field {
    flex: 1 1 10rem;
    min-width: 0;
    margin-top: 0;
    margin-bottom: 0;
}
.startups-filters__row > .field label {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--gray-light);
    margin-bottom: 0.25rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.startups-filters__row > .field input[type="text"],
.startups-filters__row > .field input[type="number"],
.startups-filters__row > .field select {
    width: 100%;
}


/* ===== Results header & count ===== */

.startups-results__header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1rem;
    margin-bottom: 0.75rem;
}
.startups-results__count {
    font-size: 0.8125rem;
    color: var(--gray-light);
}


/* ===== Active filter chips ===== */

.startups-results__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}
.filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background: var(--accent-lighter);
    color: var(--gray-dark);
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.25rem 0.5rem;
    border-radius: 999px;
    white-space: nowrap;
}
.filter-chip__remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    font-size: 0.875rem;
    line-height: 1;
    color: var(--gray-light);
    text-decoration: none;
    transition: background 0.15s, color 0.15s;
}
.filter-chip__remove:hover {
    background: var(--accent-base);
    color: var(--gray-dark);
}


/* ===== Empty state ===== */

.startups-results__empty {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--gray-light);
}
.startups-results__empty strong {
    display: block;
    font-size: 1rem;
    color: var(--gray-dark);
    margin-bottom: 0.5rem;
}


/* ===== CSV upload collapsible ===== */

.startups-upload {
    position: relative;
}
.startups-upload__form {
    position: absolute;
    right: 0;
    top: 100%;
    z-index: 10;
    background: #fff;
    border: solid 1px var(--gray-lighter);
    border-radius: 4px;
    padding: 1rem;
    margin-top: 0.25rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    min-width: 16rem;
}
.startups-upload__form .field {
    margin-bottom: 0.5rem;
}


/* ===== Button helpers ===== */

.button--outline {
    background: transparent;
    border: solid 1px var(--gray-lighter);
    color: var(--gray-dark);
}
.button--outline:hover {
    background: var(--gray-lightest);
}


/* ===== Startups table (preserved) ===== */

.startups-list {
    margin-top: 0;
}
.startups-list__table {
    --icon-size: 3.75rem;
    border-collapse: collapse;
    font-size: 0.75rem;
    font-variant-numeric: tabular-nums;
    letter-spacing: calc(-0.13 / 12 * 1em);
    line-height: calc(5 / 4);
    width: 100%;
}
.startups-list col.icon {
    width: var(--icon-size);
}
.startups-list .numeric {
    text-align: right;
}
.startups-list a,
.startups-list img {
    display: block;
}
.startups-list a {
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: calc(-0.15 / 14 * 1em);
    line-height: calc(8 / 7);
    text-decoration: none;
    text-transform: uppercase;
}
.startups-list td {
    border-top: solid 1px var(--accent-lighter);
    color: var(--gray-light);
    padding: 0 0 0.625rem;
    vertical-align: middle;
}
.startups-list th + th,
.startups-list td + td {
    padding-left: 0.625rem;
}
.startups-list th {
    text-align: left;
}

.startups-list .p-name {
    color: var(--gray-dark);
    font-size: 1rem;
    font-weight: 400;
    letter-spacing: calc(-0.17 / 16 * 1em);
    line-height: calc(19 / 16);
    text-transform: none;
}

.form--inline {
    align-items: end;
    display: flex;
    gap: 0.5rem 2rem;
}

.startup_form {
    display: grid;
    grid-column: 1;
    grid-gap: 0.5rem 1rem;
    grid-template-columns: 1fr 1fr;
}
.startup_form input[type=email],
.startup_form input[type=file],
.startup_form input[type=url],
.startup_form input[type=text],
.startup_form select {
    width: 100%;
}
.startup_form input[size] {
    width: unset;
}
.startup_form textarea {
    resize: vertical;
    width: 100%;
}

.startup_form .field--reset {
    grid-column: 1;
}
.startup_form .field--wide,
.startup_form .actions {
    grid-column: 1 / span 2;
}

.startup-attachments__upload {
    --popover-padding: 1rem 1.25rem 0.5rem;
    min-width: 16rem;
}

.request_deck_form {
    width: 100%;
}
main[data-controller~="users"] {
    display: grid;
    grid-auto-flow: row dense;
    grid-gap: 2.5rem;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: masonry;
}
main[data-controller~="users"] section {
    grid-column: 1;
}
.hidden {
    display: none !important;
}
.note {
    color: var(--gray-light);
    font-style: italic;
    letter-spacing: calc(-0.17 / 16 * 1em);
}
.sr-only {
    border: none;
    clip: rect(0,0,0,0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.view-link {
    align-self: center;
    font-size: 0.875rem;
    font-weight: 700;
    justify-self: end;
    text-decoration: none;
    text-transform: uppercase;
}

/* ============================================================================
   Default platform page redesign — every rule scoped to
   .platform-workspace-page (the wrapper around platforms#show's default
   branch). FLITE/community render outside the wrapper and keep the old look;
   shared partials (board, pipelines) get this skin ONLY on the platform page
   until the collection page adopts the scope in the next phase.

   File name deliberately sorts after utility.css in require_tree so these
   overrides sit late in the bundle; all rules also win on specificity.
   Consumes design_tokens.css. Never edits shared source rules (dashboards.css
   .under-review-*, application.css .pipeline-* are FLITE- and cache-shared).
   ========================================================================= */

/* --- page frame ------------------------------------------------------- */

/* platforms.css lays the page into a 2fr/1fr grid with sections pinned to
   column 1; the workspace owns the whole width. */
main[data-controller~="platforms"] .platform-workspace-page {
    grid-column: 1 / -1;
}

.platform-workspace-page {
    font-family: var(--font-ui);
    color: var(--text);
}

/* Header action (Settings) sits outside the wrapper — class-gated to default
   platforms only in the view. */
.page-header-action {
    display: inline-flex;
    align-items: center;
    padding: 0.375rem 0.875rem;
    font-family: var(--font-ui);
    font-size: var(--fs-ui);
    font-weight: 600;
    color: var(--teal-ink);
    text-decoration: none;
    border: 1px solid var(--line);
    border-radius: var(--radius-ctl);
    background: #fff;
}

.page-header-action:hover {
    color: var(--teal-ink-hover);
    border-color: var(--teal-ink);
}

/* --- casing: hybrid policy -------------------------------------------- */
/* Headings keep the brand uppercase (base.css); controls go sentence case. */

.platform-workspace-page :is(button, .button,
    input[type="submit"], input[type="button"], input[type="reset"]) {
    text-transform: none;
    font-family: var(--font-ui);
}

.platform-workspace-page popover-toggle summary {
    text-transform: none;
}

.platform-workspace-page .section__header a {
    text-transform: none;
}

/* --- section headers: small, strong, uppercase eyebrows ---------------- */

.platform-workspace-page .section__header {
    align-items: center;
    border-bottom: 2px solid var(--teal-rule); /* the signature hairline */
    padding-bottom: 0.5rem;
}

.platform-workspace-page .section__header h2 {
    font-size: 0.9375rem;
    font-weight: 650;
    letter-spacing: 0.04em;
    color: var(--ink);
}

/* --- control skins (4 replace 21) -------------------------------------- */

/* Primary: solid teal — every form submit on this surface. */
.platform-workspace-page input[type="submit"] {
    background: var(--teal-ink);
    border: 1px solid var(--teal-ink);
    border-radius: var(--radius-ctl);
    color: #fff;
    font-size: var(--fs-ui);
    font-weight: 600;
    padding: 0.4375rem 1rem;
    cursor: pointer;
}

.platform-workspace-page input[type="submit"]:hover {
    background: var(--teal-ink-hover);
    border-color: var(--teal-ink-hover);
}

/* Quiet text action: popover summaries (Files / Add topic / card kebabs
   keep their icon look), links in headers. */
.platform-workspace-page popover-toggle summary {
    color: var(--teal-ink);
    font-size: var(--fs-ui);
    font-weight: 600;
    cursor: pointer;
}

.platform-workspace-page popover-toggle summary:hover {
    color: var(--teal-ink-hover);
}

.platform-workspace-page .file__link {
    color: var(--teal-ink);
    font-size: var(--fs-ui);
    font-weight: 600;
}

/* --- workspace header strip ------------------------------------------- */

.workspace-actions {
    display: flex;
    align-items: center;
    gap: 1.125rem;
}

/* --- Files popover ----------------------------------------------------- */

.workspace-files summary {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}

.workspace-files__count {
    background: var(--pill-track);
    border-radius: var(--radius-pill);
    color: var(--text-muted);
    font-size: var(--fs-meta);
    font-weight: 700;
    line-height: 1.4;
    padding: 0 0.5rem;
}

.platform-workspace-page .workspace-files__panel {
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-pop);
    max-height: 26rem;
    overflow-y: auto;
    padding: 1rem 1.125rem;
    width: 26rem;
}

.workspace-files__group {
    color: var(--text-faint);
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    margin: 0.875rem 0 0.25rem;
}

.workspace-files__panel > .workspace-files__group:first-child {
    margin-top: 0;
}

.workspace-files__empty {
    color: var(--text-faint);
    font-size: var(--fs-body-sm);
    margin: 0.25rem 0;
}

/* Compact file rows: flex, small icon, name truncates, actions right. */
.workspace-files__panel .construct-list {
    --icon-size: 1.875rem;
    margin: 0;
}

.workspace-files__panel .construct-list .file {
    align-items: center;
    border-top: 1px solid var(--line-soft);
    display: flex;
    gap: 0.5rem;
    margin: 0;
    padding: 0.4375rem 0;
}

.workspace-files__panel .construct-list .file:first-child {
    border-top: none;
}

.workspace-files__panel .file__filename {
    flex: 1;
    font-size: var(--fs-body-sm);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.workspace-files__panel .file form {
    margin: 0;
}

.workspace-files__delete {
    background: none;
    border: none;
    color: var(--red-ink);
    cursor: pointer;
    font-size: var(--fs-meta);
    font-weight: 600;
    padding: 0.125rem 0.25rem;
}

.workspace-files__delete:hover {
    text-decoration: underline;
}

/* Override the primary-submit skin inside the panel's Upload form? No —
   Upload IS a primary action; it keeps the solid teal. */
.workspace-files__upload {
    border-top: 1px solid var(--line-soft);
    margin-top: 0.875rem;
    padding-top: 0.125rem;
}

.workspace-files__upload .field {
    margin: 0.5rem 0;
}

.workspace-files__upload label {
    color: var(--text-muted);
    font-size: var(--fs-ui);
}

/* --- under-review chrome: calm, amber as the signal -------------------- */
/* Overrides dashboards.css values; source rules untouched (FLITE + cached
   dashboards share them). */

.platform-workspace-page .under-review-collapsible {
    background: #fff;
    border: 1px solid var(--line);
    border-left: 3px solid var(--amber-accent); /* the "needs decision" stripe */
    border-radius: var(--radius-card);
}

.platform-workspace-page .under-review-toggle {
    background: #fff;
    border-bottom: 1px solid var(--line-soft);
    border-radius: var(--radius-card) var(--radius-card) 0 0;
}

.platform-workspace-page .under-review-toggle.collapsed {
    border-bottom-color: transparent;
    border-radius: var(--radius-card);
}

.platform-workspace-page .under-review-toggle:hover {
    background: var(--wash);
}

.platform-workspace-page .under-review-left h4 {
    color: var(--ink);
    font-size: 0.875rem;
    font-weight: 650;
    letter-spacing: 0.04em;
}

.platform-workspace-page .under-review-count {
    background: var(--amber-accent);
    border-radius: var(--radius-pill);
    color: #fff;
    font-size: var(--fs-meta);
    font-weight: 700;
    line-height: 1.5;
    padding: 0.0625rem 0.5rem;
}

.platform-workspace-page .under-review-right .toggle-icon {
    color: var(--text-faint);
}

.platform-workspace-page .under-review-content {
    border-top: none;
}

.platform-workspace-page .view-rejected-link {
    border: 1px solid var(--line);
    border-radius: var(--radius-ctl);
    color: var(--text-muted);
    font-size: var(--fs-ui);
    font-weight: 600;
    padding: 0.25rem 0.625rem;
    text-decoration: none;
}

.platform-workspace-page .view-rejected-link:hover {
    border-color: var(--text-faint);
    color: var(--ink);
}

/* ========================================================================
   .pipeline-skin — the shared pipeline scope hook
   ------------------------------------------------------------------------
   Everything below is keyed on `.pipeline-skin` rather than the platform
   page's own wrapper, because the same skin now dresses every non-FLITE
   pipeline: the platform workspace, collection pages, both dashboards and
   the partner org page. Each surface emits the class on an ancestor that
   sits OUTSIDE its live-reload turbo-frame, so frame reloads inherit the
   scope without the reload endpoints knowing anything about it.

   FLITE is excluded by omission: its pages never emit the class, so the
   base rules in application.css / flite_platform.css keep rendering them
   exactly as before.
   ======================================================================== */

/* --- org pipeline tabs -------------------------------------------------- */

/* The workspace owns the full width; lift the component cap. Both forms: the
   partner dashboard puts the hook ON the .tabs--wide element itself, so a
   descendant-only selector would silently miss it. */
.pipeline-skin.tabs--wide,
.pipeline-skin .tabs--wide {
    max-width: none;
}

.pipeline-skin .tab-header {
    border-bottom-color: var(--line);
    margin-bottom: 1rem;
}

.pipeline-skin .tab-nav a {
    background: var(--wash);
    border: 1px solid var(--line);
    border-radius: var(--radius-item) var(--radius-item) 0 0;
    color: var(--text-muted);
    font-size: var(--fs-ui);
    font-weight: 600;
    padding: 0.375rem 0.875rem;
}

.pipeline-skin .tab-nav a:hover {
    color: var(--ink);
}

.pipeline-skin .tab-nav .active {
    background: #fff;
    border-color: var(--line);
    border-bottom-color: #fff;
    box-shadow: inset 0 2px 0 var(--teal-ink); /* signature: teal top rule */
    color: var(--ink);
}

/* --- pipeline board ----------------------------------------------------- */
/* Bootstrap-grey headers → token washes; source rules untouched. */

.pipeline-skin .pipeline-header {
    background: var(--wash);
    border-bottom: 2px solid var(--line);
    border-right: 1px solid var(--line-soft);
    color: var(--text-muted);
    font-size: var(--fs-ui);
    font-weight: 650;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

/* Wider slots that also GROW to share leftover page width — few columns get
   luxuriously wide cards, many columns floor at 320px and scroll. Headers and
   columns carry identical flex so they stay aligned; the category band
   re-measures real header widths in JS. */
.pipeline-skin .pipeline-header,
.pipeline-skin .pipeline-column-content {
    flex: 1 0 320px;
    min-width: 320px;
}

/* As many equal-width cards per row as fit at >=280px each — wide columns
   get 2-3 across, the 320px floor gets one. (The shared auto-fit grid packed
   shrunken max-content cards, which truncated even short names.) Pre-JS
   default; the scroll-sync script stamps the same value inline. */
.pipeline-skin .pipeline-column-content {
    border-right: 1px solid var(--line-soft);
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    justify-content: stretch;
}

/* --- pipeline cards: horizontal, review-card idiom ---------------------- */
/* Same anatomy as the under-review cards: logo left, content right. Height is
   content-sized (no filler) but the recipe is fixed — name, meta, chips row,
   note — so cards read uniformly. */

.pipeline-skin .pipeline-column-content .startup {
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-item);
    box-shadow: var(--shadow-card);
    padding: 0.625rem 0.75rem;
    /* The shared rule is a centering flex tile with min-height: 120px —
       that's the mystery white space. Content-sized block instead. */
    display: block;
    min-height: 0;
}

.pipeline-skin .pipeline-column-content .startup:hover {
    box-shadow: var(--shadow-pop);
}

.pipeline-skin .pipeline-column-content .startup-card-link {
    display: grid;
    grid-template-columns: 40px 1fr;
    gap: 0.625rem;
    align-items: start;
    text-align: left;
}

.pipeline-skin .pipeline-column-content .startup .u-logo {
    width: 40px;
    height: 40px;
    margin: 0;
    border: 1px solid var(--line-soft);
    border-radius: var(--radius-ctl);
    background: var(--wash);
    object-fit: cover;
}

.pipeline-skin .pipeline-column-content .startup .startup__body {
    text-align: left;
    min-width: 0;
}

.pipeline-skin .pipeline-column-content .startup .startup__name {
    color: var(--ink);
    font-size: 0.8125rem;
    font-weight: 700;
    line-height: 1.25;
    margin: 0;
    text-align: left;
    /* Room for the top-right kebab. */
    padding: 0 1.25rem 0 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pipeline-skin .pipeline-column-content .startup .startup__meta {
    color: var(--text-faint);
    font-size: var(--fs-meta);
    line-height: 1.35;
    margin-top: 0.0625rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Subtopic + tags share one clipped row. */
.pipeline-skin .pipeline-column-content .startup .startup__chips {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0.25rem;
    margin-top: 0.3125rem;
    overflow: hidden;
}

/* Let the tag pills flow in the chips row alongside the subtopic. */
.pipeline-skin .pipeline-column-content .startup .startup__chips .startup__tags {
    display: contents;
}

.pipeline-skin .pipeline-column-content .startup .startup__subtopic {
    flex: 0 1 auto;
    display: inline-block;
    padding: 0 0.4375rem;
    background: var(--pill-track);
    border-radius: var(--radius-pill);
    color: var(--text-muted);
    font-size: 0.6875rem;
    font-weight: 600;
    line-height: 1.6;
    text-align: left;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pipeline-skin .pipeline-column-content .startup .startup__approval-comment {
    margin-top: 0.25rem;
}

.pipeline-skin .pipeline-column-content .startup .startup__approval-comment small {
    color: var(--text-faint);
    font-size: var(--fs-meta);
    font-style: normal;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* One row of tags, clipped — variable tag counts must not change the card
   height. Full tag management lives in the kebab. */
.pipeline-skin .pipeline-column-content .startup .startup__tags {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.25rem;
    margin-top: 0.3125rem;
    overflow: hidden;
}

.pipeline-skin .pipeline-column-content .startup .startup__tags .tag-pill {
    flex: 0 0 auto;
    border-radius: var(--radius-pill);
    font-size: 0.625rem;
    font-weight: 600;
    line-height: 1.6;
    padding: 0 0.4375rem;
}

.pipeline-skin .pipeline-column-content .startup .startup__controls {
    top: 0.375rem;
    right: 0.375rem;
}

/* --- dashboard tab strips ----------------------------------------------- */
/* The seamless dashboard's org tabs and its nested Pipeline|Table bar use a
   different component from the `.tab-nav` strips above (underline rather than
   folder tabs). Keep their structure — just move them onto the tokens and the
   teal rule, so the chrome hosting a reskinned pipeline doesn't read as a
   different era. Scoped, so any other `.enhanced-tabs` on the page is
   untouched. */

.pipeline-skin .enhanced-tab-link {
    color: var(--text-muted);
    font-family: var(--font-ui);
    font-size: var(--fs-ui);
    font-weight: 600;
}

.pipeline-skin .enhanced-tab-link:hover {
    background: var(--wash);
    color: var(--ink);
}

.pipeline-skin .enhanced-tab-link.active {
    background: #fff;
    border-bottom-color: var(--teal-ink);
    color: var(--ink);
}

.pipeline-skin .nested-tab-btn {
    color: var(--text-muted);
    font-family: var(--font-ui);
    font-size: var(--fs-ui);
    font-weight: 600;
}

.pipeline-skin .nested-tab-btn:hover {
    background: var(--wash);
    color: var(--ink);
}

.pipeline-skin .nested-tab-btn.active {
    background: #fff;
    border-bottom-color: var(--teal-ink);
    color: var(--ink);
}

.pipeline-skin .nested-tab-btn:first-child {
    border-right-color: var(--line);
}

/* --- read-only FLITE round entries ------------------------------------- */
/* These ride inside the dashboard / org-page columns (never on a FLITE page),
   so they take the same horizontal anatomy as their neighbours — a column
   mixing two card shapes reads as a bug. The badge becomes a chip in the
   card's chips row; flite_platform.css keeps owning its colours, and the
   table-row variant of the badge is untouched. */

.pipeline-skin .pipeline-column-content .flite-entry-card .flite-round-badge {
    margin-top: 0;
    padding: 0 0.4375rem;
    border-radius: var(--radius-pill);
    font-size: 0.625rem;
    line-height: 1.6;
}

/* No reader here: say so with the cursor rather than implying a card action. */
.pipeline-skin .pipeline-column-content .flite-entry-card {
    cursor: default;
}

/* dashboards.css sizes the pre-JS "loading" state to the legacy 200px floor;
   under the skin that renders a visible snap from narrow to wide columns once
   the scroll-sync script stamps its widths. Match the skin's floor instead.
   (Three classes + later load order beat the source rule.) */
.pipeline-skin .pipeline-container.pipeline-loading .pipeline-header,
.pipeline-skin .pipeline-container.pipeline-loading .pipeline-column-content {
    flex: 1 0 320px;
    min-width: 320px;
}

/* --- select2 inside the scope ------------------------------------------ */

.platform-workspace-page .select2-container .select2-selection {
    border-color: var(--line);
    border-radius: var(--radius-ctl);
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *



 */

.form--inline {
    align-items: end;
    display: flex;
    gap: 0.5rem 2rem;
}

.top-left-tiny {
    display: grid;
    grid-column: 1 / -1;
    grid-gap: 1rem 0.5rem;
}

.pagy-nav {
    text-align: center;
    margin-top: 20px;
    display: flex;
    justify-content: center;
}

.pagy-nav a, .pagy-nav span {
    margin: 0 5px;
    padding: 5px 10px;
    border: 1px solid #ccc;
    text-decoration: none;
    color: #333;
}

.pagy-nav .page.current {
    background-color: #007bff;
    color: white;
}

.pagy-nav a[aria-disabled="true"], .pagy-nav a[aria-disabled="true"]:hover {
    cursor: not-allowed;
    background-color: #f5f5f5;
    color: #ccc;
    border: 1px solid #ccc;
}

.main__liner .construct-list li {
    border-top: solid 1px var(--accent-base);
    margin: 0 0 0.625rem;
    min-height: var(--icon-size);
    padding: 0;
    padding-top: 0.625rem;
}

/* Remove top border for the first item within .main_liner .construct-list */
.main__liner .construct-list li:first-child {
    border-top: none;
    padding-top: 10px;
}

.embedded-scouting-priority {
    align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

/* Pipeline Filter Toggle */
.pipeline-filters {
    display: flex;
    justify-content: flex-end;
    gap: 1.5rem;
    padding: 0.5rem 0;
    margin-bottom: 0.5rem;
}

.pipeline-filter-toggle {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    user-select: none;
}

.pipeline-filter-toggle input[type="checkbox"] {
    display: none;
}

.toggle-slider {
    width: 36px;
    height: 20px;
    background: #d1d5db;
    border-radius: 10px;
    position: relative;
    transition: background 0.2s ease;
}

.toggle-slider::before {
    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    background: white;
    border-radius: 50%;
    top: 2px;
    left: 2px;
    transition: transform 0.2s ease;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}

.pipeline-filter-toggle input[type="checkbox"]:checked + .toggle-slider {
    background: var(--accent-base, #3b82f6);
}

.pipeline-filter-toggle input[type="checkbox"]:checked + .toggle-slider::before {
    transform: translateX(16px);
}

.toggle-label {
    font-size: 0.875rem;
    color: #4b5563;
    font-weight: 500;
}

/* Full Width Pipeline Styles */
.pipeline-full-width {
    width: 100%;
    margin: 1rem 0;
}

.pipeline-container {
    width: 100%;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    background: white;
    position: relative;
    overflow: hidden;
}

/* Top scrollbar — native browser scrollbar for maximum visibility */
.pipeline-scroll-top {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-color: #888 #f1f1f1;
}

.pipeline-scroll-dummy {
    height: 12px;
    /* Width will be set via JavaScript to match content width */
}

/* Main pipeline content — scrolls both axes.
   The horizontal scrollbar is hidden by pushing it below
   the container's overflow:hidden boundary via negative margin. */
.pipeline-content {
    width: 100%;
    overflow-x: auto;
    overflow-y: auto;
    max-height: calc(100vh - 14rem);
    padding: 0 0 20px 0;
    margin: 0 0 -20px 0;
    scrollbar-color: #c0c0c0 #f0f0f0;
}

/* WebKit (Chrome, Edge, Safari, Opera): thin vertical, hidden horizontal */
.pipeline-content::-webkit-scrollbar {
    width: 6px;
    height: 0;
}
.pipeline-content::-webkit-scrollbar-track {
    background: transparent;
}
.pipeline-content::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 4px;
}
.pipeline-content::-webkit-scrollbar-thumb:hover {
    background: #9ca3af;
}

.pipeline-headers {
    display: flex;
    width: 100%;
    min-width: 100%;
    position: sticky;
    top: 0;
    z-index: 10;
    background: #f8f9fa;
}

.pipeline-header {
    background: #f8f9fa;
    border-right: 1px solid #dee2e6;
    border-bottom: 2px solid #6c757d;
    padding: 0.75rem 1rem;
    text-align: center;
    font-weight: 600;
    color: #495057;
    min-width: 200px;
    flex: 0 0 200px;
}

.pipeline-header:last-child {
    border-right: none;
}

/* ---- Stagegate category band (sits above the column headers) ----
   Each cell width = (visible columns it spans) * 200px, matching the fixed
   200px .pipeline-header / .pipeline-column-content slots (global border-box),
   so the band lines up exactly with the columns below. Borders are inside the
   border-box, so separators never shift the alignment. */
.pipeline-category-band {
    display: flex;
    width: 100%;
    min-width: 100%;
    background: #f8f9fa;
    padding-top: 0.45rem;
}

.pipeline-category-cell {
    flex: 0 0 200px;
    min-width: 0;
    padding: 0.4rem 0.85rem;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    line-height: 1.2;
    border-right: 3px solid #f8f9fa;       /* separates adjacent colored bands */
    border-radius: 6px 6px 0 0;
}

.pipeline-category-cell:last-child {
    border-right: none;
}

/* Spacer above the "New" column and any uncategorized run — keeps alignment
   without painting a band. */
.pipeline-category-cell--empty {
    background: transparent !important;
    border-right-color: transparent;
    border-radius: 0;
}

.pipeline-category-cell__label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}

.pipeline-columns {
    display: flex;
    align-items: stretch;
    width: 100%;
    min-height: 400px;
    margin: 0;
    padding: 0;
    gap: 0;
}

.pipeline-column-content {
    border-right: 1px solid #dee2e6;
    padding: 0.25rem 0.75rem 1rem 0.75rem;
    min-height: 400px;
    min-width: 200px;
    flex: 0 0 200px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, max-content));
    gap: 0.75rem;
    align-content: start;
    justify-content: center;
}

.pipeline-column-content:last-child {
    border-right: none;
}

/* Compact startup cards for pipeline */
.pipeline-column-content .startup {
    max-width: none;
    width: 100%;
    min-width: 140px;
    padding: 0.75rem;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    background: white;
    border: 1px solid #e9ecef;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 120px;
}

.pipeline-column-content .startup:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
}

/* Prevent hover effects when popover is open */
.pipeline-column-content .startup:has(popover-toggle details[open]) {
    transform: none !important;
}

.pipeline-column-content .startup:has(popover-toggle details[open]):hover {
    transform: none !important;
}

/* Restructure startup card layout */
.pipeline-column-content .startup .u-logo {
    display: block;
    margin: 0 auto 0.75rem auto;
    width: 80px;
    height: 80px;
}

.pipeline-column-content .startup .startup__body {
    text-align: center;
    justify-self: center;
    width: 100%;
}

.pipeline-column-content .startup .startup__name {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.2;
    word-break: normal;
    overflow-wrap: break-word;
    hyphens: none;
    margin: 0 auto 0.5rem auto;
    padding: 0 0.25rem;
    white-space: normal;
    display: block;
    text-align: center;
}

.pipeline-column-content .startup .response-indicator {
    margin-top: 0.5rem;
    text-align: center;
}

.pipeline-column-content .startup .response-badge {
    font-size: 0.7rem;
    padding: 0.2rem 0.4rem;
}

/* Position popover toggle for compact cards */
.pipeline-column-content .startup popover-toggle {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
}

.pipeline-column-content .startup {
    position: relative;
}

/* Startup Card Link Styles */
.startup-card-link {
    display: block;
    text-decoration: none;
    color: inherit;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    width: 100%;
}

/* Specifically for pipeline cards */
.pipeline-column-content .startup-card-link {
    display: block;
    width: 100%;
    text-align: center;
}

.startup-card-link:hover {
    text-decoration: none;
    color: inherit;
    transform: translateY(-1px);
}

.startup-card-link:hover .startup {
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.startup-card-link--clickable {
    cursor: pointer;
}

/* Startup Card Name (no longer a link) */
.startup__name {
    font-weight: 500;
    color: #2c3e50;
    display: block;
    margin-bottom: 0.25rem;
}

/* Response Indicator */
.response-indicator {
    margin-top: 0.5rem;
}

.response-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background: #e9ecef;
    color: #495057;
    padding: 0.25rem 0.5rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 500;
    border: 1px solid #dee2e6;
}

.response-badge:hover {
    background: #dee2e6;
    cursor: help;
}

/* Collection Startup Pipeline Cards */
.pipeline-column-content .collection-startup .startup__subtopic {
    font-size: 0.7rem;
    color: #6b7280;
    font-weight: 400;
    margin-top: 0.25rem;
    text-align: center;
}

/* Collection startup controls positioning */
.pipeline-column-content .collection-startup .startup__controls {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
}

.pipeline-column-content .collection-startup {
    position: relative;
}

/* Under Review Section */
.under-review-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 0.75rem;
    align-content: start;
    justify-content: center;
    padding: 1rem;
    margin: 0;
}

.under-review-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

.under-review-card {
    width: 100%;
    padding: 0.75rem;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    background: white;
    border: 2px solid #f59e0b;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    text-decoration: none;
    color: inherit;
    position: relative;
    aspect-ratio: 1;
}

.under-review-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
    border-color: #d97706;
    text-decoration: none;
    color: inherit;
}

.under-review-card .u-logo {
    display: block;
    margin: 0 auto 0.75rem auto;
    width: 80px;
    height: 80px;
}

.under-review-card .startup__body {
    text-align: center;
}

.under-review-card .startup__name {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.2;
    word-break: normal;
    overflow-wrap: break-word;
    hyphens: none;
    margin: 0 auto 0.25rem auto;
    padding: 0 0.25rem;
    white-space: normal;
}

.under-review-card .startup__subtopic {
    font-size: 0.7rem;
    color: #6b7280;
    font-weight: 400;
    margin-top: 0.25rem;
    text-align: center;
}

.under-review-action-btn {
    background: #f59e0b;
    color: white;
    border: none;
    padding: 0.5rem 1rem;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    width: 100%;
}

.under-review-action-btn:hover {
    background: #d97706;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

/* Subtopic and Stagegate Management */
.subtopic-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem;
}

.subtopic-name {
    flex: 1;
}

.subtopic-menu-toggle,
.tag-menu-toggle,
.stagegate-header-menu {
    background: none;
    border: none;
    font-size: 1.2rem;
    color: var(--accent-darker);
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 4px;
    transition: all 0.2s ease;
    line-height: 1;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.subtopic-menu-toggle:hover,
.tag-menu-toggle:hover,
.stagegate-header-menu:hover {
    background: rgba(0,0,0,0.1);
}

.stagegate-header {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.stagegate-header-menu {
    margin-left: 0.5rem;
}

/* Context Menu */
.context-menu {
    background: white;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    min-width: 120px;
}

.menu-item {
    padding: 0.75rem 1rem;
    cursor: pointer;
    font-size: 0.875rem;
    border-bottom: 1px solid #f3f4f6;
}

.menu-item:last-child {
    border-bottom: none;
}

.menu-item:hover {
    background: #f9fafb;
}

.menu-item--danger:hover {
    background: #fef2f2;
    color: #dc2626;
}

/* Modal Styling */
.subtopic-modal,
.stagegate-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999999;
}

.modal-backdrop {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
}

.modal-content {
    position: relative;
    background: white;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.2);
    min-width: 400px;
    max-width: 500px;
}

.modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 1.5rem 0;
    border-bottom: 1px solid #e5e7eb;
    margin-bottom: 1.5rem;
}

.modal-header h3 {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
}

.modal-close {
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: #6b7280;
    padding: 0;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-close:hover {
    color: #374151;
}

.modal-body {
    padding: 0 1.5rem 1.5rem;
}

.hidden {
    display: none !important;
}

/* Responsive Design */
@media (max-width: 1200px) {
    .pipeline-header,
    .pipeline-column-content {
        min-width: 180px;
    }
    
    .under-review-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1000px) {
    .under-review-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 800px) {
    .under-review-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 600px) {
    .under-review-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 400px) {
    .under-review-grid {
        grid-template-columns: 1fr;
    }
}

/* Loading placeholder and spinner for lazy loading */
.loading-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    min-height: 200px;
}

.loading-spinner {
    width: 40px;
    height: 40px;
    border: 3px solid #e5e7eb;
    border-top-color: #3b82f6;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/* Infinite scroll loading indicator */
.infinite-scroll-loading {
    text-align: center;
    padding: 1rem;
    color: #6b7280;
}