/* Customise – shared workspace shell and cards for Heuristics / SEQ. */
#app .customise-page {width:100%;max-width:1400px;margin:0 auto}
#app .customise-page .pagehead {margin-bottom:20px}
#app .customise-page .pagehead h1 {font-size:clamp(28px,3vw,38px);letter-spacing:-.025em}
#app .customise-page .pagehead p {max-width:700px}
#app .customise-tabs{display:flex;align-items:flex-end;gap:26px;border-bottom:1px solid #454A4D;margin-bottom:20px}
#app .customise-tabs .customise-tab{appearance:none;border:0;border-bottom:3px solid transparent;background:transparent;color:#BAC1C0;font-size:14px;font-weight:600;border-radius:0;min-height:46px;padding:11px 2px;white-space:nowrap}
#app .customise-tabs .customise-tab.active{color:#D7E45B;border-color:#D7E45B}
#app .customise-tabs .customise-tab:hover:not(.active){color:#EEEDE8}
#app .customise-tabs .customise-tab:focus-visible{outline:2px solid #D7E45B;outline-offset:3px;border-radius:3px}
#app .customise-description {margin:0 0 23px;line-height:1.55;font-size:14px;color:#B9C0BE;max-width:720px}
#app .customise-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
#app .customise-card{display:flex;flex-direction:column;align-items:flex-start;min-height:220px;padding:22px 21px;background:#232629;border:1px solid #404649;border-radius:12px}
#app .customise-card h2{color:#EEEDE8;font-size:18px;line-height:1.3;margin:13px 0 8px;letter-spacing:-.018em}
#app .customise-card p{font-size:13px;line-height:1.55;margin:0 0 16px;max-width:46ch;color:#B8C0BD}
#app .customise-card-status{font-size:10px;font-weight:750;letter-spacing:.07em;text-transform:uppercase;color:#C6C8C1}
#app .customise-card:nth-child(2) .customise-card-status{color:#D7E45B}
#app .customise-card .customise-card-action{margin-top:auto;min-height:44px;max-width:100%}
#app .customise-card .customise-card-action:disabled{margin-top:auto;background:#353A3C;color:#B3BCB7;opacity:1;cursor:not-allowed;border:1px solid #535B5C}
#app .customise-card .customise-card-note{font-size:12px;color:#ADB4B1;margin-top:auto}
#app .customise-generals {margin-top:42px;padding-top:22px;border-top:1px solid #404649}
#app .customise-generals-header {margin-bottom:17px}
#app .customise-generals h2 {font-size:20px;color:#EEEDE8;line-height:1.3;margin:0 0 7px}
#app .customise-generals p,#app .customise-availability {font-size:13px;line-height:1.6;color:#ABB4B0;max-width:710px}
#app .customise-page .archetypes {display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:12px}
#app .customise-availability {margin:22px 0 0}
@media (max-width:1100px){
 #app .customise-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 #app .customise-card:last-child{grid-column:1/-1;min-height:160px}
}
@media (max-width:740px){
 #app .customise-page{padding:22px 18px}
 #app .customise-grid{grid-template-columns:minmax(0,1fr)}
 #app .customise-card:last-child{grid-column:auto}
 #app .customise-card{min-height:175px}
 #app .customise-page .archetypes{grid-template-columns:minmax(0,1fr)}
 #app .customise-generals{margin-top:28px}
}


#app .customise-protocol-picker{padding:0 0 24px;margin:0 0 22px;border-bottom:1px solid #444C4B}
#app .customise-protocol-picker h3{font-size:16px;line-height:1.4;margin:0 0 12px}
#app .customise-protocol-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#app .customise-protocol-current,#app .customise-protocol-future{display:flex;flex-direction:column;gap:5px;align-items:flex-start;text-align:left;min-height:84px;padding:17px 18px;border-radius:11px;border:1px solid #5B635B;background:#232629;color:#EEEDE8;font-size:14px}
#app .customise-protocol-current{border-color:#D7E45B;background:#303427}
#app .customise-protocol-options small{color:#B4BFB7;font-size:12px}
#app .customise-protocol-current small{color:#D7E45B}
#app .customise-protocol-future{opacity:.62;border-style:dashed}
@media(max-width:600px){#app .customise-protocol-options{grid-template-columns:1fr}}


/* Keep selected and hovered general profiles on graphite: the global button hover is citron. */
#app .customise-page .archetypes button.profile.selected {
  background: #2B2F34;
  border-color: #D7E45B;
  color: #EEEDE8;
  -webkit-text-fill-color: #EEEDE8;
}
#app .customise-page .archetypes button.profile:is(:hover,:focus-visible,:active),
#app .customise-page .archetypes button.profile.selected:is(:hover,:focus-visible,:active) {
  background: #30363B;
  border-color: #D7E45B;
  color: #EEEDE8;
  -webkit-text-fill-color: #EEEDE8;
  filter: none;
}
#app .customise-page .archetypes button.profile:is(:hover,:focus-visible,:active) :is(h3,.top),
#app .customise-page .archetypes button.profile.selected :is(h3,.top) {
  color: #EEEDE8;
  -webkit-text-fill-color: #EEEDE8;
}
#app .customise-page .archetypes button.profile:is(:hover,:focus-visible,:active) :is(p,.fine),
#app .customise-page .archetypes button.profile.selected :is(p,.fine) {
  color: #C2C7CA;
  -webkit-text-fill-color: #C2C7CA;
}
#app .customise-page .archetypes button.profile:focus-visible {
  outline: 2px solid #D7E45B;
  outline-offset: 4px;
}

.seq-default-summary{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin:24px 0}
.seq-default-summary p{margin:4px 0 0}
.seq-saved-profiles{margin:24px 0}
.seq-saved-profiles h3{margin:0 0 16px}
.seq-profile-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:12px}
.seq-profile-card{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:18px}
.seq-profile-card .top{display:flex;justify-content:space-between;align-items:center;width:100%;gap:8px}
.seq-profile-card h3,.seq-profile-card p{margin:0}
.seq-profile-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:8px}

#app .customise-page .seq-profile-card.selected {
  border-color:#D7E45B;
  box-shadow:inset 0 0 0 1px #D7E45B;
}
#app .seq-default-indicator {
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:#D7E45B;
  font-size:13px;
}
#app .seq-default-indicator .review-selection {
  display:inline-grid;
  place-items:center;
  width:20px;
  height:20px;
  border:1px solid currentColor;
  border-radius:50%;
}
#app .customise-page :is(.seq-profile-actions,.customise-card) button.review-text-link {
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:#EEEDE8;
  -webkit-text-fill-color:currentColor;
  font-size:13px;
  font-weight:400;
  text-decoration:underline;
  text-underline-offset:3px;
  filter:none;
}
#app .customise-page :is(.seq-profile-actions,.customise-card) button.review-text-link:hover {
  color:#D7E45B;
}
#app .customise-page :is(.seq-profile-actions,.customise-card) button.review-text-link:focus-visible {
  outline:2px solid #D7E45B;
  outline-offset:4px;
}

/* Keep short custom profiles aligned with their taller neighbours in the review picker. */
#app .archetypes > button.profile {
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:stretch;
}

.rubric-editor.card {
  box-sizing: border-box;
  width: min(44rem, calc(100% - 2rem));
  max-height: calc(100dvh - 2rem);
  margin: auto;
  padding: 0;
  overflow: hidden;
}
.rubric-editor::backdrop { background: rgb(0 0 0 / 55%); }
.rubric-editor form {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  max-height: calc(100dvh - 2rem);
}
.rubric-editor h2 { margin: 0; padding: 1.25rem 1.5rem .75rem; }
.rubric-editor-body {
  display: grid;
  gap: 1rem;
  overflow-y: auto;
  padding: .5rem 1.5rem 1rem;
}
.rubric-editor label, .rubric-editor [data-principles] { display: grid; gap: .5rem; min-width: 0; }
.rubric-editor :is(input, select, textarea) { box-sizing: border-box; width: 100%; min-width: 0; }
.rubric-editor textarea { min-height: 4rem; resize: vertical; }
.rubric-editor fieldset {
  display: grid;
  gap: .875rem;
  min-width: 0;
  margin: 0;
  padding: 1rem;
  border: 1px solid rgb(255 255 255 / 16%);
  border-radius: .5rem;
}
.rubric-editor-body button { justify-self: start; }
.rubric-editor [role="status"] { margin: 0; }
.rubric-editor [role="status"]:empty { display: none; }
.rubric-editor footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .5rem;
  padding: .875rem 1.5rem;
  border-top: 1px solid rgb(255 255 255 / 16%);
}
@media (max-width: 480px) {
  .rubric-editor h2, .rubric-editor-body, .rubric-editor footer { padding-inline: 1rem; }
  .rubric-editor footer > button { flex: 1 1 auto; }
}

#heuristic-builder-editor { margin-top: 1rem; }
.rubric-page-fields label, .rubric-page-fields [data-principles] { display: grid; gap: .5rem; min-width: 0; }
.rubric-page-fields label, .rubric-page-fields [data-add] { margin-top: 1rem; }
.rubric-page-fields :is(input, textarea) { box-sizing: border-box; width: 100%; min-width: 0; }
.rubric-page-fields fieldset { min-width: 0; border: 1px solid var(--line); border-radius: 8px; padding: 1rem; }
.rubric-page-fields fieldset > button { margin-top: 1rem; }
.rubric-page-fields [role="status"]:empty { display: none; }