:root {
  color-scheme: dark;
  --bg: #06101e;
  --bg-deep: #030914;
  --surface: #0c1a2c;
  --surface-2: #10233a;
  --surface-3: #142b45;
  --surface-soft: rgba(18, 43, 69, .66);
  --line: rgba(173, 216, 255, .15);
  --line-strong: rgba(173, 216, 255, .28);
  --text: #eef7ff;
  --muted: #9fb5c9;
  --muted-2: #748ba1;
  --ice: #7ce7ff;
  --ice-strong: #38c9f0;
  --pink: #ff68c7;
  --lavender: #b998ff;
  --green: #62e2ac;
  --yellow: #ffd166;
  --orange: #ff9a62;
  --red: #ff7186;
  --shadow: 0 24px 64px rgba(0, 0, 0, .32);
  --radius-xl: 24px;
  --radius-lg: 18px;
  --radius-md: 13px;
  --radius-sm: 9px;
  --max: 1540px;
  --font: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; max-width: 100%; overflow-x: clip; }
body { max-width: 100%; overflow-x: clip; }
body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  background:
    radial-gradient(circle at 16% -10%, rgba(56, 201, 240, .12), transparent 30rem),
    radial-gradient(circle at 96% 8%, rgba(255, 104, 199, .10), transparent 30rem),
    linear-gradient(180deg, var(--bg-deep), var(--bg) 34rem);
  color: var(--text);
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.5;
}

button, input, select, textarea { font: inherit; }
button, select { cursor: pointer; }
a { color: var(--ice); }
img, svg { display: block; }

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.skip-link {
  position: fixed;
  left: 16px;
  top: -100px;
  z-index: 9999;
  padding: 10px 16px;
  border-radius: 8px;
  color: #04111d;
  background: var(--ice);
  font-weight: 800;
}
.skip-link:focus { top: 16px; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  border-bottom: 1px solid var(--line);
  background: rgba(3, 9, 20, .86);
  backdrop-filter: blur(18px) saturate(130%);
}
.header-shell {
  width: min(calc(100% - 32px), var(--max));
  min-height: 76px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 24px;
}
.brand {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 11px;
  border: 0;
  padding: 0;
  background: none;
  color: var(--text);
  text-align: left;
}
.brand-mark {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(124, 231, 255, .28);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(124, 231, 255, .12), rgba(255, 104, 199, .08));
  box-shadow: inset 0 0 22px rgba(124, 231, 255, .08);
}
.brand-mark svg { width: 34px; height: 34px; }
.brand-mark path {
  fill: none;
  stroke: var(--ice);
  stroke-width: 3.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.brand-mark circle { fill: var(--pink); }
.brand strong { display: block; letter-spacing: -.02em; }
.brand small { display: block; color: var(--muted); font-size: .875rem; }

.primary-nav {
  display: flex;
  align-self: stretch;
  align-items: stretch;
  gap: 3px;
  overflow-x: auto;
  scrollbar-width: none;
}
.primary-nav::-webkit-scrollbar { display: none; }
.nav-tab {
  position: relative;
  border: 0;
  padding: 0 13px;
  background: none;
  color: var(--muted);
  white-space: nowrap;
  font-size: .88rem;
  font-weight: 680;
}
.nav-tab::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: -1px;
  height: 3px;
  border-radius: 3px 3px 0 0;
  background: transparent;
}
.nav-tab:hover { color: var(--text); }
.nav-tab.is-active { color: var(--ice); }
.nav-tab.is-active::after { background: linear-gradient(90deg, var(--ice), var(--pink)); }

.header-status {
  margin-left: auto;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 9px;
  color: var(--muted);
  font-size: .875rem;
  line-height: 1.25;
}
.header-status strong { color: var(--text); font-weight: 720; }
.status-dot {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 0 5px rgba(98, 226, 172, .12), 0 0 16px rgba(98, 226, 172, .5);
}

main { min-height: calc(100vh - 180px); }
.tab-panel { padding: 42px 0 78px; }
.tab-panel[hidden] { display: none !important; }
.page-shell { width: min(calc(100% - 40px), var(--max)); margin: 0 auto; }
.narrow-shell { max-width: 1240px; }
.wide-shell { max-width: 1460px; }

.season-banner {
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 28px;
  margin-bottom: 18px;
  padding: 31px 34px;
  border: 1px solid rgba(124, 231, 255, .22);
  border-radius: var(--radius-xl);
  background:
    linear-gradient(110deg, rgba(56, 201, 240, .14), rgba(185, 152, 255, .08) 50%, rgba(255, 104, 199, .12)),
    var(--surface);
  box-shadow: var(--shadow);
}
.season-banner::before {
  content: "";
  position: absolute;
  width: 330px;
  height: 330px;
  right: 3%;
  top: -230px;
  border: 2px solid rgba(124, 231, 255, .15);
  border-radius: 50%;
  box-shadow: 0 0 0 30px rgba(124, 231, 255, .025), 0 0 0 66px rgba(255, 104, 199, .025);
}
.season-banner > * { position: relative; z-index: 1; }
.season-banner h1,
.page-heading h1 {
  max-width: 920px;
  margin: 0;
  font-size: clamp(2rem, 4vw, 3.6rem);
  line-height: 1.05;
  letter-spacing: -.045em;
}
.season-banner p:not(.eyebrow), .page-heading p:not(.eyebrow) {
  max-width: 850px;
  margin: 13px 0 0;
  color: var(--muted);
  font-size: 1.03rem;
}
.eyebrow, .section-kicker {
  margin: 0 0 6px;
  color: var(--ice);
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: .875rem;
  font-weight: 850;
}
.season-banner-actions { display: flex; gap: 9px; flex-wrap: wrap; justify-content: flex-end; }

.notice {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  color: var(--muted);
  background: rgba(16, 35, 58, .75);
}
.notice.compact { padding: 13px 16px; font-size: .88rem; }
.notice strong { color: var(--text); }
.notice.warning { border-color: rgba(255, 209, 102, .25); background: rgba(255, 209, 102, .07); }
.notice.info { border-color: rgba(124, 231, 255, .22); background: rgba(124, 231, 255, .07); }

.workspace-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 365px;
  gap: 20px;
  align-items: start;
  margin-top: 20px;
}
.workspace-main { min-width: 0; display: grid; gap: 18px; }
.workspace-aside { display: grid; gap: 18px; position: sticky; top: 96px; }

.card, .score-card, .method-card, .source-status-card, .profile-rules-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: linear-gradient(180deg, rgba(14, 31, 51, .96), rgba(10, 24, 41, .96));
  box-shadow: 0 14px 42px rgba(0, 0, 0, .17);
}
.card { padding: 23px; }
.card-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}
.card-heading h2, .actions-card h2, .method-card h2 {
  margin: 0;
  font-size: 1.15rem;
  line-height: 1.2;
  letter-spacing: -.015em;
}
.card-heading p.muted { margin: 7px 0 0; max-width: 720px; }
.split-heading { align-items: center; }
.muted { color: var(--muted); }
p.muted { font-size: .88rem; }
.pill {
  display: inline-flex;
  align-items: center;
  min-height: 27px;
  padding: 4px 9px;
  border: 1px solid rgba(124, 231, 255, .23);
  border-radius: 999px;
  color: var(--ice);
  background: rgba(124, 231, 255, .07);
  font-size: .875rem;
  font-weight: 780;
  white-space: nowrap;
}

.form-grid { display: grid; gap: 15px; }
.profile-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.details-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.span-2 { grid-column: span 2; }
.span-4 { grid-column: span 4; }
.field { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.field > span {
  color: #c8d8e6;
  font-size: .875rem;
  font-weight: 760;
}
.field small, .deduction-item small {
  color: var(--muted-2);
  font-size: .875rem;
  line-height: 1.35;
}
input, select, textarea {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  padding: 9px 11px;
  outline: none;
  background: rgba(3, 12, 24, .68);
  color: var(--text);
  transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
textarea { resize: vertical; min-height: 72px; }
input::placeholder, textarea::placeholder { color: #668096; }
input:hover, select:hover, textarea:hover { border-color: rgba(124, 231, 255, .35); }
input:focus, select:focus, textarea:focus {
  border-color: var(--ice-strong);
  box-shadow: 0 0 0 3px rgba(56, 201, 240, .12);
  background: rgba(5, 17, 31, .95);
}
input[type="checkbox"] { width: 18px; min-height: 18px; accent-color: var(--ice-strong); }
input[type="range"] { accent-color: var(--ice-strong); }
.profile-actions { justify-content: flex-end; }
.profile-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin-top: 18px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--line);
}
.profile-summary > div {
  min-height: 73px;
  padding: 13px 15px;
  background: rgba(5, 17, 31, .78);
}
.profile-summary span { display: block; color: var(--muted-2); font-size: .875rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 760; }
.profile-summary strong { display: block; margin-top: 4px; font-size: .875rem; line-height: 1.35; }

.button-row { display: flex; align-items: center; gap: 8px; }
.button-row.wrap { flex-wrap: wrap; justify-content: flex-end; }
.button {
  min-height: 39px;
  border: 1px solid transparent;
  border-radius: 10px;
  padding: 8px 13px;
  color: var(--text);
  font-size: .875rem;
  font-weight: 760;
  transition: transform .12s ease, border-color .12s ease, background .12s ease;
}
.button:hover { transform: translateY(-1px); }
.button:active { transform: translateY(0); }
.button.primary { color: #02121e; background: linear-gradient(135deg, var(--ice), #51d2ff); box-shadow: 0 8px 20px rgba(56, 201, 240, .15); }
.button.secondary { border-color: rgba(124, 231, 255, .24); background: rgba(124, 231, 255, .08); }
.button.secondary:hover { background: rgba(124, 231, 255, .13); }
.button.ghost { border-color: var(--line); background: transparent; color: var(--muted); }
.button.ghost:hover { color: var(--text); border-color: var(--line-strong); }
.button.danger-ghost { border-color: rgba(255, 113, 134, .2); background: transparent; color: var(--red); }
.text-button {
  border: 0;
  padding: 0;
  background: none;
  color: var(--ice);
  font-size: .875rem;
  font-weight: 730;
}
.text-button:hover { text-decoration: underline; }
.icon-button {
  width: 38px;
  height: 38px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255, 255, 255, .03);
  color: var(--text);
  font-size: 1.5rem;
  line-height: 1;
}

.table-wrap { width: 100%; max-width: 100%; min-width: 0; overflow-x: auto; contain: layout paint; border: 1px solid var(--line); border-radius: var(--radius-md); }
table { width: 100%; border-collapse: collapse; }
th {
  padding: 10px 8px;
  border-bottom: 1px solid var(--line);
  color: var(--muted-2);
  background: rgba(4, 13, 25, .78);
  text-align: left;
  text-transform: uppercase;
  letter-spacing: .065em;
  font-size: .875rem;
  font-weight: 850;
  white-space: nowrap;
}
td { padding: 9px 7px; border-bottom: 1px solid rgba(173, 216, 255, .09); vertical-align: middle; }
tbody tr:last-child td { border-bottom: 0; }
.element-table { min-width: 1040px; }
.element-table tbody tr { background: rgba(5, 17, 31, .3); }
.element-table tbody tr:hover { background: rgba(124, 231, 255, .035); }
.element-table tbody tr.row-error { box-shadow: inset 3px 0 var(--red); }
.element-table tbody tr.row-warning { box-shadow: inset 3px 0 var(--yellow); }
.element-table input, .element-table select, .element-table textarea { min-height: 35px; padding: 6px 7px; font-size: .875rem; }
.element-table textarea { min-height: 35px; height: 35px; resize: vertical; }
.col-order { width: 54px; }
.col-requirement { width: 190px; }
.col-code { width: 166px; }
.col-bv { width: 76px; }
.col-x { width: 44px; text-align: center; }
.col-goe { width: 75px; }
.col-score { width: 78px; }
.col-notes { width: 190px; }
.col-actions { width: 96px; }
.order-cell { display: flex; align-items: center; gap: 5px; }
.order-number { min-width: 18px; color: var(--muted); font-family: var(--mono); font-size: .875rem; }
.reorder-stack { display: flex; flex-direction: column; gap: 2px; }
.row-icon-button {
  width: 24px;
  height: 18px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: 0;
  background: rgba(255,255,255,.02);
  color: var(--muted);
  font-size: .875rem;
}
.row-icon-button:hover { color: var(--text); border-color: var(--line-strong); }
.requirement-cell strong { display: block; color: #d7e7f4; font-size: .875rem; line-height: 1.25; }
.requirement-cell small { display: block; margin-top: 3px; color: var(--muted-2); font-size: .875rem; line-height: 1.25; }
.code-wrap { position: relative; }
.code-input { font-family: var(--mono); font-weight: 760; letter-spacing: -.02em; }
.code-status { display: block; margin-top: 3px; color: var(--muted-2); font-size: .875rem; line-height: 1.25; }
.code-status.ok { color: var(--green); }
.code-status.warn { color: var(--yellow); }
.code-status.error { color: var(--red); }
.bv-input { text-align: right; font-variant-numeric: tabular-nums; }
.x-cell { text-align: center; }
.score-value { display: block; text-align: right; font-size: .875rem; font-weight: 850; font-variant-numeric: tabular-nums; }
.base-value-hint { display: block; text-align: right; color: var(--muted-2); font-size: .875rem; }
.row-actions { display: flex; justify-content: flex-end; gap: 4px; }
.delete-row { color: var(--red); }
.element-legend { display: flex; flex-wrap: wrap; gap: 8px 14px; margin-top: 11px; color: var(--muted-2); font-size: .875rem; }
kbd, code {
  border: 1px solid var(--line-strong);
  border-radius: 5px;
  padding: 1px 5px;
  background: rgba(0,0,0,.2);
  color: var(--ice);
  font-family: var(--mono);
  font-size: .9em;
}

.pcs-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.component-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 68px;
  gap: 12px;
  align-items: end;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: rgba(5, 17, 31, .55);
}
.component-head { grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 12px; }
.component-head h3 { margin: 0; font-size: .88rem; }
.component-head p { margin: 5px 0 0; color: var(--muted-2); font-size: .875rem; line-height: 1.4; }
.component-head output { color: var(--ice); font-size: 1.35rem; font-weight: 900; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.range-input { min-height: 30px; padding: 0; border: 0; background: transparent; box-shadow: none !important; }
.number-input { text-align: right; }
.pcs-controls {
  display: flex;
  align-items: flex-end;
  gap: 15px;
  flex-wrap: wrap;
  margin-top: 15px;
  padding-top: 15px;
  border-top: 1px solid var(--line);
}
.compact-field { gap: 5px; }
.compact-field input, .compact-field select { min-height: 37px; }
.pcs-controls .compact-field { width: 130px; }
.inline-guidance { margin-left: auto; color: var(--muted); font-size: .875rem; }
.inline-guidance.ceiling-warning { color: var(--yellow); }

.deduction-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.deduction-item { display: flex; flex-direction: column; justify-content: flex-start; }
.is-hidden { display: none !important; }

.actions-card { display: flex; justify-content: space-between; align-items: center; gap: 22px; }
.actions-card p { margin: 5px 0 0; }

.score-card {
  position: relative;
  overflow: hidden;
  padding: 25px;
  border-color: rgba(124, 231, 255, .25);
  background:
    radial-gradient(circle at 80% -10%, rgba(255, 104, 199, .16), transparent 13rem),
    radial-gradient(circle at 15% 105%, rgba(56, 201, 240, .14), transparent 13rem),
    linear-gradient(160deg, #0e2741, #091829);
  box-shadow: 0 22px 50px rgba(0,0,0,.27), inset 0 1px rgba(255,255,255,.035);
}
.score-card::after {
  content: "";
  position: absolute;
  right: -26px;
  top: 56px;
  width: 130px;
  height: 130px;
  border: 1px solid rgba(124, 231, 255, .08);
  border-radius: 50%;
}
.score-card > * { position: relative; z-index: 1; }
.score-card-topline { display: flex; justify-content: space-between; align-items: center; color: var(--muted); font-size: .875rem; font-weight: 750; text-transform: uppercase; letter-spacing: .065em; }
.live-label { display: inline-flex; align-items: center; gap: 5px; color: var(--green); }
.live-label i { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 10px rgba(98, 226, 172, .7); }
.total-score { display: block; margin: 13px 0 19px; font-size: clamp(3.15rem, 6vw, 4.55rem); line-height: .95; font-weight: 920; letter-spacing: -.07em; font-variant-numeric: tabular-nums; }
.score-breakdown { display: grid; gap: 8px; padding: 14px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.score-breakdown div { display: flex; justify-content: space-between; gap: 10px; }
.score-breakdown span { color: var(--muted); font-size: .875rem; }
.score-breakdown strong { font-size: .875rem; font-variant-numeric: tabular-nums; }
.score-meta { display: grid; gap: 4px; margin-top: 13px; color: var(--muted-2); font-size: .875rem; }
.validation-heading { align-items: center; }
.validation-count { display: grid; place-items: center; min-width: 34px; height: 34px; border-radius: 50%; background: rgba(124, 231, 255, .08); color: var(--ice); font-size: .875rem; font-weight: 850; }
.validation-summary { display: flex; gap: 7px; flex-wrap: wrap; margin-bottom: 12px; }
.summary-chip { display: inline-flex; align-items: center; gap: 5px; padding: 4px 7px; border-radius: 999px; font-size: .875rem; font-weight: 780; }
.summary-chip.error { color: #ffc2cb; background: rgba(255, 113, 134, .12); }
.summary-chip.warning { color: #ffe7a3; background: rgba(255, 209, 102, .12); }
.summary-chip.info { color: #bfefff; background: rgba(124, 231, 255, .10); }
.summary-chip.pass { color: #bff7df; background: rgba(98, 226, 172, .10); }
.validation-list { display: grid; gap: 8px; max-height: 510px; overflow-y: auto; padding-right: 3px; }
.validation-item { display: grid; grid-template-columns: 22px minmax(0,1fr); gap: 9px; padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: rgba(5,17,31,.45); }
.validation-icon { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; font-size: .875rem; font-weight: 900; }
.validation-item.error .validation-icon { color: #fff; background: rgba(255, 113, 134, .68); }
.validation-item.warning .validation-icon { color: #261d04; background: var(--yellow); }
.validation-item.info .validation-icon { color: #041721; background: var(--ice); }
.validation-item.pass .validation-icon { color: #031812; background: var(--green); }
.validation-item strong { display: block; font-size: .875rem; line-height: 1.35; }
.validation-item p { margin: 3px 0 0; color: var(--muted); font-size: .875rem; line-height: 1.4; }
.validation-empty { padding: 18px 10px; color: var(--muted); text-align: center; font-size: .875rem; }
.compact-reference .card-heading { margin-bottom: 12px; }
.mini-rubric { display: grid; gap: 8px; margin-bottom: 12px; }
.mini-rubric div { display: grid; grid-template-columns: 48px 1fr; gap: 8px; }
.mini-rubric strong { color: var(--ice); font-size: .875rem; }
.mini-rubric span { color: var(--muted); font-size: .875rem; line-height: 1.35; }

.page-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 30px;
  margin-bottom: 28px;
}
.page-heading h1 { font-size: clamp(2.2rem, 4vw, 3.8rem); }
.saved-toolbar, .value-toolbar, .rules-tools, .rules-profile-strip {
  display: flex;
  align-items: center;
  gap: 11px;
}
.saved-toolbar { justify-content: space-between; margin-bottom: 17px; }
.search-field { min-width: 280px; }
.search-field input { padding-left: 14px; }
.saved-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.saved-card {
  display: flex;
  flex-direction: column;
  min-height: 236px;
  padding: 19px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: linear-gradient(180deg, rgba(14,31,51,.95), rgba(9,23,39,.95));
}
.saved-card-top { display: flex; justify-content: space-between; gap: 12px; }
.saved-card h2 { margin: 8px 0 4px; font-size: 1rem; line-height: 1.25; }
.saved-card p { margin: 0; color: var(--muted); font-size: .875rem; }
.saved-score { color: var(--ice); font-size: 1.65rem; font-weight: 900; letter-spacing: -.04em; }
.saved-meta { display: grid; gap: 5px; margin: 16px 0; padding: 12px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--muted-2); font-size: .875rem; }
.saved-card .button-row { margin-top: auto; flex-wrap: wrap; }
.empty-state { grid-column: 1 / -1; padding: 54px 24px; border: 1px dashed var(--line-strong); border-radius: var(--radius-lg); text-align: center; color: var(--muted); }
.empty-state strong { display: block; margin-bottom: 5px; color: var(--text); font-size: 1rem; }

.rules-heading { align-items: flex-end; }
.rules-tools { min-width: min(100%, 520px); justify-content: flex-end; }
.rules-tools .search-field { flex: 1; }
.rules-profile-strip {
  justify-content: space-between;
  margin: 0 0 12px;
  padding: 12px 15px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: rgba(12, 26, 44, .7);
  color: var(--muted);
  font-size: .875rem;
}
.rules-profile-strip select { width: auto; min-width: 285px; }
.profile-rules-card { margin-bottom: 21px; padding: 20px; border-color: rgba(124, 231, 255, .2); }
.profile-rules-card h2 { margin: 0 0 7px; font-size: 1.05rem; }
.profile-rules-meta { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 13px; }
.profile-rules-list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.profile-rules-list li { position: relative; padding-left: 18px; color: #ccdae6; font-size: .875rem; }
.profile-rules-list li::before { content: ""; position: absolute; left: 1px; top: .54em; width: 7px; height: 7px; border-radius: 50%; background: var(--ice); box-shadow: 0 0 8px rgba(124,231,255,.4); }
.results-meta { margin: 15px 0; color: var(--muted-2); font-size: .875rem; }
.rules-list { display: grid; gap: 10px; }
.rule-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: rgba(12, 26, 44, .83);
}
.rule-card[open] { border-color: rgba(124, 231, 255, .25); }
.rule-card summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 16px 18px;
  list-style: none;
  cursor: pointer;
}
.rule-card summary::-webkit-details-marker { display: none; }
.rule-summary-title { display: flex; align-items: flex-start; gap: 11px; }
.rule-category-mark { width: 9px; height: 9px; margin-top: 6px; border-radius: 50%; background: var(--ice); box-shadow: 0 0 10px rgba(124,231,255,.35); }
.rule-category-mark.season { background: var(--pink); }
.rule-category-mark.goe { background: var(--green); }
.rule-category-mark.components { background: var(--lavender); }
.rule-category-mark.deductions { background: var(--yellow); }
.rule-category-mark.levels { background: var(--orange); }
.rule-category-mark.codes { background: #82a9ff; }
.rule-card h2 { margin: 0; font-size: .92rem; }
.rule-card summary p { margin: 4px 0 0; color: var(--muted); font-size: .875rem; }
.rule-chevron { color: var(--muted); transition: transform .15s ease; }
.rule-card[open] .rule-chevron { transform: rotate(180deg); }
.rule-content { padding: 0 18px 18px 38px; color: #c9d8e5; font-size: .875rem; }
.rule-content p { margin: 0 0 11px; }
.rule-content ul, .rule-content ol { margin: 8px 0 13px; padding-left: 19px; }
.rule-content li { margin: 5px 0; }
.rule-content h3 { margin: 17px 0 7px; color: var(--text); font-size: .875rem; }
.rule-content .rule-table { margin: 13px 0; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.rule-content .rule-table table { min-width: 600px; }
.rule-content .rule-table td { font-size: .875rem; }
.source-link { display: inline-flex; align-items: center; gap: 6px; color: var(--ice); font-size: .875rem; font-weight: 720; text-decoration: none; }
.source-link:hover { text-decoration: underline; }

.values-heading { align-items: flex-end; }
.value-toolbar { margin-bottom: 13px; }
.grow { flex: 1; min-width: 300px; }
.value-toolbar select { width: auto; min-width: 180px; }
.values-table-wrap { margin-top: 14px; }
.values-table { min-width: 980px; }
.values-table td { color: #cedce8; font-size: .875rem; }
.values-table td:first-child { color: var(--ice); font-family: var(--mono); font-weight: 790; }
.values-table td:nth-child(5), .values-table td:nth-child(6), .values-table td:nth-child(7) { text-align: right; font-variant-numeric: tabular-nums; }
.values-table th:nth-child(5), .values-table th:nth-child(6), .values-table th:nth-child(7) { text-align: right; }

.source-status-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 17px;
  padding: 17px 20px;
  border-color: rgba(98, 226, 172, .22);
}
.source-status-card > div { display: flex; align-items: center; gap: 12px; }
.source-status-card p { max-width: 650px; margin: 0; color: var(--muted); font-size: .875rem; }
.sources-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.source-card {
  display: grid;
  grid-template-columns: 45px minmax(0,1fr);
  gap: 14px;
  min-height: 158px;
  padding: 17px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: rgba(12,26,44,.78);
}
.source-number { width: 45px; height: 45px; display: grid; place-items: center; border: 1px solid rgba(124,231,255,.22); border-radius: 12px; color: var(--ice); background: rgba(124,231,255,.06); font-family: var(--mono); font-size: .875rem; font-weight: 850; }
.source-card h2 { margin: 0; font-size: .88rem; line-height: 1.3; }
.source-card p { margin: 6px 0 10px; color: var(--muted); font-size: .875rem; line-height: 1.45; }
.source-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 9px; }
.source-tag { padding: 3px 7px; border-radius: 999px; background: rgba(185,152,255,.1); color: #d7c8ff; font-size: .875rem; font-weight: 720; }
.method-card { margin-top: 18px; padding: 24px; }
.method-card p { max-width: 920px; margin: 9px 0 0; color: var(--muted); font-size: .875rem; }

.guide-dialog {
  width: min(calc(100% - 28px), 720px);
  max-height: min(800px, calc(100vh - 48px));
  overflow-y: auto;
  border: 1px solid rgba(124,231,255,.28);
  border-radius: var(--radius-xl);
  padding: 24px;
  background: #0b1b2e;
  color: var(--text);
  box-shadow: 0 34px 110px rgba(0,0,0,.65);
}
.guide-dialog::backdrop { background: rgba(0, 5, 12, .76); backdrop-filter: blur(7px); }
.dialog-heading { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; }
.dialog-heading h2 { margin: 0; font-size: 1.4rem; }
.guide-steps { display: grid; gap: 11px; margin: 22px 0; padding-left: 22px; }
.guide-steps li { padding-left: 4px; color: var(--muted); font-size: .875rem; }
.guide-steps strong { color: var(--text); }
.formula-card { padding: 16px; border: 1px solid rgba(124,231,255,.22); border-radius: var(--radius-md); background: rgba(124,231,255,.06); }
.formula-card span { display: block; color: var(--ice); font-size: .875rem; font-weight: 820; text-transform: uppercase; letter-spacing: .08em; }
.formula-card strong { display: block; margin-top: 6px; font-size: .875rem; }
.dialog-actions { display: flex; justify-content: flex-end; margin-top: 18px; }

.toast-region { position: fixed; z-index: 999; right: 20px; bottom: 20px; display: grid; gap: 9px; width: min(360px, calc(100% - 40px)); }
.toast { display: grid; grid-template-columns: 22px 1fr; gap: 10px; align-items: start; padding: 13px 14px; border: 1px solid var(--line-strong); border-radius: 12px; background: rgba(12, 27, 46, .98); box-shadow: var(--shadow); animation: toast-in .2s ease-out; }
.toast strong { display: block; font-size: .875rem; }
.toast span { display: block; margin-top: 2px; color: var(--muted); font-size: .875rem; }
.toast-icon { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; color: #03151f; background: var(--ice); font-size: .875rem; font-weight: 900; }
.toast.error .toast-icon { color: #fff; background: var(--red); }
.toast.success .toast-icon { background: var(--green); }
@keyframes toast-in { from { transform: translateY(12px); opacity: 0; } }

.site-footer { border-top: 1px solid var(--line); background: rgba(3,9,20,.8); }
.footer-shell { min-height: 92px; display: flex; justify-content: space-between; align-items: center; gap: 25px; color: var(--muted-2); font-size: .875rem; }
.footer-shell > div:first-child { display: grid; gap: 3px; }
.footer-shell strong { color: var(--text); }

@media (max-width: 1260px) {
  .header-status { display: none; }
  .workspace-grid { grid-template-columns: minmax(0, 1fr) 330px; }
  .profile-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .deduction-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1040px) {
  .site-header { position: relative; }
  .header-shell { min-height: auto; padding: 13px 0 0; flex-wrap: wrap; }
  .brand { width: 100%; }
  .primary-nav { width: 100%; height: 49px; order: 3; }
  .workspace-grid { grid-template-columns: 1fr; }
  .workspace-aside { position: static; grid-template-columns: 1fr 1fr; }
  .score-card { grid-column: 1 / -1; }
  .pcs-grid { grid-template-columns: 1fr; }
  .deduction-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .saved-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rules-heading, .values-heading { align-items: flex-start; flex-direction: column; }
  .rules-tools { width: 100%; justify-content: stretch; }
  .sources-list { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .page-shell { width: min(calc(100% - 24px), var(--max)); }
  .tab-panel { padding: 25px 0 52px; }
  .season-banner { align-items: flex-start; flex-direction: column; padding: 24px; }
  .season-banner-actions { justify-content: flex-start; }
  .card { padding: 18px; }
  .card-heading, .split-heading, .page-heading, .source-status-card, .actions-card { align-items: flex-start; flex-direction: column; }
  .profile-grid, .details-grid { grid-template-columns: 1fr; }
  .span-2, .span-4 { grid-column: auto; }
  .profile-summary { grid-template-columns: 1fr; }
  .deduction-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .workspace-aside { grid-template-columns: 1fr; }
  .score-card { grid-column: auto; }
  .inline-guidance { width: 100%; margin-left: 0; }
  .actions-card .button-row { justify-content: flex-start; }
  .saved-grid { grid-template-columns: 1fr; }
  .saved-toolbar, .value-toolbar, .rules-tools, .rules-profile-strip { align-items: stretch; flex-direction: column; }
  .search-field, .grow, .rules-profile-strip select, .value-toolbar select { width: 100%; min-width: 0; }
  .footer-shell { padding: 20px 0; align-items: flex-start; flex-direction: column; }
}

@media (max-width: 480px) {
  .deduction-grid { grid-template-columns: 1fr; }
  .button-row { flex-wrap: wrap; }
  .season-banner h1, .page-heading h1 { font-size: 2rem; }
  .total-score { font-size: 3.35rem; }
}

@media print {
  :root { color-scheme: light; }
  body { background: #fff; color: #111; font-size: 10pt; }
  .site-header, .site-footer, .season-banner, .notice, .actions-card, .workspace-aside .validation-card, .compact-reference, .button, .text-button, .element-legend, .row-actions, .reorder-stack, .nav-tab { display: none !important; }
  .tab-panel { display: none !important; padding: 0; }
  #panel-builder { display: block !important; }
  .page-shell { width: 100%; }
  .workspace-grid { display: block; }
  .workspace-main { display: block; }
  .card, .score-card { break-inside: avoid; margin-bottom: 10pt; border: 1px solid #bbb; box-shadow: none; background: #fff; color: #111; }
  .workspace-aside { position: static; display: block; }
  .score-card { display: block !important; margin-top: 12pt; }
  input, select, textarea { border: 0; border-bottom: 1px solid #bbb; background: transparent; color: #111; }
  .profile-summary > div, .component-card { background: #fff; }
  .muted, .field small, .score-breakdown span, .score-meta { color: #555; }
  .table-wrap { overflow: visible; border-color: #bbb; }
  .element-table { min-width: 0; }
  th { background: #eee; color: #333; }
  td, th { border-color: #ccc; }
  .col-actions { display: none; }
  .total-score, .component-head output, .pill, .eyebrow, .section-kicker { color: #111; }
}

/* The working form always owns the full page width. */
.workspace-main { grid-template-columns: minmax(0, 1fr); }
.workspace-main > *, .workspace-aside, .card, .score-card { min-width: 0; }
.toast-region, .toast { pointer-events: none; }

/* Readable scoring controls and a compact working surface. */
.season-banner { padding: 20px 24px; }
.season-banner h1 { font-size: clamp(1.7rem, 3vw, 2.5rem); line-height: 1.15; }
.rule-content, .guide-steps li { font-size: 1rem; }
.element-table input, .element-table select, .element-table textarea { min-height: 44px; }
.requirement-cell small, .code-status, .base-value-hint { font-size: .8125rem; line-height: 1.4; }
.rule-content h3 { font-size: 1rem; }
:focus-visible { outline: 2px solid var(--ice); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
.workspace-grid { display: flex; flex-direction: column; }
.workspace-main, .workspace-aside { width: 100%; }
.workspace-aside { position: static; display: grid; grid-template-columns: 2fr 1fr; }
.score-strip { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; column-gap: 40px; padding: 22px 28px; }
.score-strip .score-card-topline, .score-strip .score-meta { grid-column: 1 / -1; }
.score-strip .total-score { font-size: 3.1rem; margin: 8px 0; }
.score-strip .score-breakdown { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; border: 0; padding: 0; }
.score-strip .score-breakdown > div { display: grid; gap: 5px; }
.score-strip .score-meta { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 6px; }
.element-table { width: 100%; min-width: 0; table-layout: fixed; }
.element-table th { white-space: normal; font-size: .75rem; }
.col-order { width: 5%; } .col-requirement { width: 15%; } .col-code { width: 23%; } .col-info { width: 6%; }
.col-bv { width: 8%; } .col-x { width: 4%; } .col-goe { width: 8%; }
.col-score { width: 8%; } .col-notes { width: 13%; } .col-actions { width: 5%; }
.element-table td { overflow-wrap: anywhere; }
.element-table input, .element-table select, .element-table textarea { width: 100%; min-width: 0; }
.element-table input[type=checkbox] { width: 20px; }
.code-entry { display: flex; align-items: stretch; gap: 6px; }
.code-entry .code-input { flex: 1; min-width: 0; }
.build-code-button { flex: 0 0 58px; border: 1px solid var(--line-strong); color: var(--ice); background: var(--surface); border-radius: 7px; padding: 4px; font-size: .875rem; line-height: 1.2; font-weight: 750; }
.build-code-button:hover { background: rgba(124,231,255,.12); }
.deduction-fields { display: contents; }
.deduction-role { color: var(--ice); font-size: .75rem; }
[aria-invalid=true] { border-color: var(--red) !important; }
.entry-dialog { width: min(760px, calc(100% - 24px)); max-height: 90dvh; overflow-y: auto; }
.category-menu { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 22px; }
.category-menu button { text-align: left; justify-content: space-between; min-height: 54px; }
.builder-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 16px 0; }
.jump-builder-row { border: 1px solid var(--line); padding: 16px; border-radius: 12px; margin: 12px 0; }
.jump-builder-heading { display: flex; align-items: center; justify-content: space-between; }
.jump-builder-heading h3 { margin: 0; }
.builder-check { display: flex; align-items: center; gap: 10px; color: var(--muted); margin: 14px 0; }
.builder-check input { width: 20px; height: 20px; min-height: 20px; }
.notation-choices { grid-column: 1 / -1; border: 0; padding: 0; margin: 4px 0 12px; min-width: 0; }
.notation-choices legend { padding: 0; font-weight: 700; font-size: .875rem; margin-bottom: 10px; }
.notation-options { display: flex; flex-wrap: wrap; gap: 8px; }
.notation-option { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line-strong); padding: 10px 12px; border-radius: 9px; cursor: pointer; font-size: .875rem; }
.notation-option:has(input:checked) { background: rgba(124,231,255,.13); color: var(--ice); border-color: var(--ice); }
.notation-option input { width: 18px; height: 18px; min-height: 18px; margin: 0; accent-color: var(--ice); }
.competition-status { min-height: 1.4em; margin: 10px 0 20px; }
.competition-status.error, #edit-roster-status { color: var(--yellow); }
.competition-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 18px; }
.competition-card { text-align: left; display: grid; gap: 14px; padding: 26px; border: 1px solid var(--line-strong); border-radius: 14px; background: var(--surface); color: var(--text); cursor: pointer; }
.competition-card strong { font-size: 1.3rem; }
.competition-card:hover { border-color: var(--ice); }
.competition-empty { padding: 38px; border: 1px dashed var(--line-strong); border-radius: 14px; }
.competition-dialog { width: min(1200px, calc(100% - 24px)); max-height: 94dvh; overflow: auto; }
.competition-dialog .form-grid { margin: 20px 0; }
.competition-import-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 22px 0; }
.competition-import-options section { padding: 20px; border: 1px solid var(--line-strong); border-radius: 12px; min-width: 0; }
.competition-import-options small { display: block; margin-top: 12px; }
.competition-dialog textarea, .competition-dialog input, .competition-dialog select { width: 100%; min-width: 0; }
.competition-dialog input[type=file] { white-space: normal; }
.import-segment { margin: 20px 0; border-top: 1px solid var(--line-strong); padding-top: 20px; }
.import-segment > .card-heading { display: flex; flex-wrap: wrap; gap: 16px; }
.import-segment > .card-heading .field { flex: 1 1 220px; }
.roster-table-wrap { overflow-x: auto; }
.roster-table { width: 100%; text-align: left; border-collapse: collapse; }
.roster-table th, .roster-table td { padding: 14px 10px; border-bottom: 1px solid var(--line-strong); vertical-align: top; }
.roster-table th { font-size: .78rem; color: var(--muted); }
.roster-table small { display: block; color: var(--muted); margin-top: 5px; }
.roster-table td:first-child { width: 70px; }
.roster-table .button.small { padding: 7px 12px; min-height: 38px; }
.import-table { min-width: 680px; }
.import-table td:nth-child(2) { width: 75px; }
.import-table td:nth-child(3) { min-width: 180px; }
.import-table td:nth-child(4) { min-width: 100px; }
.import-table td:nth-child(5) { min-width: 190px; }
.import-table input { min-height: 36px; padding: 7px; }
.import-codes { display: flex; flex-wrap: wrap; gap: 7px; }
.import-codes label { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; width: 190px; }
.import-codes label > span { width: 16px; font-size: .7rem; color: var(--muted); }
.import-codes input { flex: 1; width: 154px; font-family: var(--mono); font-size: .8rem; }
.import-codes small { margin: 0 0 0 21px; }
.segment-tabs, .source-links { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0; }
.segment-tabs .button { font-size: .82rem; }
.roster-heading { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; margin: 20px 0; }
.completed-pill { color: var(--green); }
.judging-bar { border: 1px solid var(--ice); background: rgba(11, 38, 56, .95); border-radius: 14px; padding: 22px; margin-bottom: 22px; display: grid; gap: 12px; }
.judging-bar[hidden] { display: none; }
.judging-bar h2, .judging-bar p { margin: 0; }
.judging-bar .builder-check { font-size: .85rem; }
#judging-save-status { flex: 1 1 260px; font-size: .85rem; color: var(--muted); }
.competition-results { margin-top: 24px; }
.competition-results summary { cursor: pointer; font-weight: bold; }
.competition-results li { padding: 10px 5px; }
.competition-results li strong { margin-left: 24px; }
.imported-info { color: var(--ice) !important; }
.competition-busy #competition-content button, .competition-busy #judging-bar button { opacity: .6; pointer-events: none; }
@media (max-width: 760px) {
  .competition-import-options { grid-template-columns: 1fr; }
  .competition-dialog { padding: 18px; }
  .competition-roster { padding: 14px; }
  .roster-table:not(.import-table) { min-width: 640px; }
  .judging-bar { padding: 16px; }
}
@media print { .competition-protocol { break-after: page; } .competition-protocol:last-child { break-after: auto; } }
.bonus-choice { padding: 14px; border: 1px solid var(--line-strong); border-radius: 10px; }
.code-preview { display: grid; gap: 8px; padding: 18px; border: 1px solid var(--line-strong); border-radius: 12px; margin-top: 20px; background: rgba(124,231,255,.06); }
.code-preview > span { color: var(--muted); font-size: .8rem; }
.code-preview output { font: 700 1.3rem var(--mono); color: var(--ice); overflow-wrap: anywhere; }
.builder-feedback { color: var(--muted); font-size: .875rem; line-height: 1.6; margin: 14px 0; }
.builder-feedback.error { color: var(--red); }
.protocol-dialog { width: min(980px, calc(100% - 24px)); max-height: 94dvh; overflow: auto; }
.protocol-paper { background: #fff; color: #172332; padding: 32px; border-radius: 3px; margin-top: 22px; font: 14px/1.5 Arial, sans-serif; }
.protocol-paper h2, .protocol-paper h3 { color: #172332; }
.protocol-paper h3 { margin-top: 24px; }
.protocol-paper table { width: 100%; table-layout: fixed; border-collapse: collapse; }
.protocol-paper th { background: #eaf0f5; color: #26384b; font-size: 11px; letter-spacing: 0; white-space: normal; }
.protocol-paper td { font-size: 12px; padding: 9px 5px; border-bottom: 1px solid #d5dde5; overflow-wrap: anywhere; }
.protocol-totals { display: flex; flex-wrap: wrap; gap: 12px 24px; padding: 16px 0; border-top: 2px solid #172332; border-bottom: 1px solid #c9d3de; }
.protocol-paper p { white-space: pre-wrap; overflow-wrap: anywhere; }
@media screen and (max-width: 1000px) {
  .workspace-aside { grid-template-columns: 1fr; }
  .element-table, .element-table tbody { display: block; }
  .element-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .element-table tr { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding: 16px; border-bottom: 1px solid var(--line-strong); }
  .element-table td { display: block; border: 0; padding: 0; }
  .element-table td::before { content: attr(data-label); display: block; font-size: .72rem; color: var(--muted); margin-bottom: 5px; }
  .element-table .requirement-cell { grid-column: span 3; }
  .element-table .element-code-cell, .element-table .element-notes-cell { grid-column: 1 / -1; }
  .element-table .element-actions-cell { grid-column: 4; grid-row: 4; justify-self: end; }
  .element-table .element-notes-cell { grid-column: 1 / 4; }
  .element-table textarea { min-height: 54px; }
  .order-cell { flex-wrap: wrap; }
  .reorder-stack { flex-direction: row; }
  .row-icon-button { width: 28px; height: 28px; }
  .score-strip { grid-template-columns: 1fr; gap: 8px; }
  .score-strip .score-breakdown { gap: 12px; }
}
@media screen and (max-width: 540px) {
  .builder-grid, .category-menu { grid-template-columns: 1fr; }
  .entry-dialog, .protocol-dialog { padding: 20px; }
  .protocol-paper { padding: 12px; }
  .score-strip { padding: 20px; }
  .score-strip .score-breakdown span { font-size: .75rem; }
}
@media print {
  @page { size: A4; margin: 12mm; }
  body.printing-protocol > * { display: none !important; }
  body.printing-protocol #print-dialog { display: block !important; position: static; width: auto; max-width: none; height: auto; max-height: none; overflow: visible; padding: 0; margin: 0; border: 0; background: white; }
  #print-dialog > :not(#protocol-preview) { display: none !important; }
  #print-dialog::backdrop { display: none; }
  .protocol-paper { margin: 0; padding: 0; }
  .protocol-paper tr { break-inside: avoid; }
  .protocol-paper thead { display: table-header-group; }
}

/* Shared panels: the marking area always occupies the available width. */
.panel-settings { margin: 20px 0 28px; padding: 20px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-2); }
.panel-settings > summary { font-weight: 750; cursor: pointer; font-size: 1.05rem; }
.panel-setup-row { display: flex; flex-wrap: wrap; align-items: end; gap: 18px; margin: 20px 0; }
.panel-seat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); gap: 14px; }
.panel-seat { background: var(--surface-3); border: 1px solid var(--line); border-radius: 12px; padding: 18px; display: grid; gap: 12px; align-content: start; }
.panel-seat input { width: 100%; }
.panel-notifications { padding: 18px 22px; margin: 20px 0; background: rgba(98, 226, 172, .10); border: 1px solid rgba(98, 226, 172, .4); border-radius: 12px; }
.judge-dots { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 6px; }
.judge-dot { display: inline-flex; font-size: .875rem; border: 1px solid var(--line-strong); padding: 4px 6px; border-radius: 5px; background: var(--surface-3); white-space: nowrap; }
.judge-dot.complete { color: var(--green); background: rgba(98, 226, 172, .12); border-color: rgba(98, 226, 172, .4); }
.judge-dot.draft { background: rgba(124, 231, 255, .12); color: var(--ice); }
.judge-dot.review { background: rgba(255, 209, 102, .12); color: var(--yellow); }
.judge-dot.vacant { border-style: dashed; color: var(--muted); }
.panel-mark-list { width: 100%; margin: 25px 0 32px; }
.panel-mark-row { display: flex; gap: 18px; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); padding: 18px 0; flex-wrap: wrap; }
.panel-call { display: flex; align-items: center; gap: 14px; flex: 1 1 300px; }
.panel-call > div { flex: 1; }
.panel-call strong { font-size: 1.05rem; overflow-wrap: anywhere; }
.panel-call small { display: block; color: var(--muted); margin-top: 4px; }
.panel-call > span:last-child { white-space: nowrap; color: var(--muted); font-size: .875rem; }
.goe-buttons { display: flex; border: 0; padding: 0; margin: 0; gap: 5px; flex-wrap: wrap; }
.goe-choice { position: relative; display: grid; place-items: center; min-width: 39px; height: 40px; border: 1px solid var(--line-strong); border-radius: 7px; cursor: pointer; background: var(--surface-3); font-weight: 650; }
.goe-choice input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; cursor: pointer; }
.goe-choice.selected { background: var(--ice); border-color: var(--ice); color: var(--bg-deep); }
.goe-choice:focus-within { outline: 3px solid var(--ice-strong); outline-offset: 2px; }
.panel-pcs-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 20px 0; }
.panel-pcs-grid input[type=number] { font-size: 1.3rem; padding: 14px; }
.panel-submit-bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; border-top: 1px solid var(--line); padding: 18px 0 0; margin-top: 22px; }
.panel-join { max-width: 580px; margin: 30px auto; display: grid; gap: 18px; }
.roster-removed { opacity: .6; background: var(--surface-2); }
.discarded-mark { text-decoration: line-through; color: #677688; }
.panel-protocol table { font-variant-numeric: tabular-nums; font-size: 11px; }
.panel-protocol details { font-size: 11px; }
@media (max-width: 650px) { .panel-pcs-grid { grid-template-columns: 1fr; gap: 15px; } .goe-buttons { width: 100%; } .goe-choice { flex: 1; min-width: 25px; } .panel-call { flex-basis: 100%; } .panel-settings { padding: 14px; } }
@media print { .discarded-mark { text-decoration: line-through; } .panel-protocol { break-before: page; } }

.goe-choice:has(input:disabled) { opacity: .35; cursor: not-allowed; }

.phase-actions { margin: 18px 0; }
.phase-actions > .muted { flex: 1 1 320px; }
.overall-results { border-top: 1px solid var(--line); margin-top: 28px; padding-top: 18px; }
.overall-results details { margin: 16px 0; }
.overall-results summary { cursor: pointer; font-weight: 700; margin-bottom: 12px; }
.panel-info-call { display: inline-flex; align-items: center; gap: 8px; padding: 4px 9px; margin-top: 7px; border: 1px solid rgba(255, 209, 102, .42); border-radius: 6px; background: rgba(255, 209, 102, .08); color: var(--yellow); }
.panel-info-call span { font-size: .875rem; }
.panel-call .panel-info-call strong { font-family: var(--mono); font-size: .9375rem; }
.serious-error-choice { max-width: 440px; margin: 12px 0; }

.technical-team h3 { font-size: 1rem; line-height: 1.4; }
.technical-invite-fields { margin: 14px 0; }
.technical-invite-fields summary { cursor: pointer; margin-bottom: 12px; }
.technical-change-list { padding-left: 20px; margin: 12px 0; }
.technical-change-list li { margin: 10px 0; }
.technical-change-list span { display: block; overflow-wrap: anywhere; font-family: var(--mono); font-size: .9375rem; margin-top: 4px; }
.technical-history-entry { border-bottom: 1px solid var(--line); padding: 14px 0; }
.needs-call-review { border-color: var(--yellow); background: rgba(255,209,102,.045); }
.call-review-check { flex-basis: 100%; padding-top: 8px; color: var(--yellow); font-size: .9375rem; }
.review-note { color: var(--yellow); }
#shared-live-alerts:empty { display: none; }
#shared-live-alerts { margin-bottom: 16px; }
#shared-stale-alert .button { margin: 8px 0 0 12px; }
#shared-technical-preview { border-top: 1px solid var(--line); margin: 14px 0; padding-top: 12px; }
#shared-technical-preview summary { font-weight: 700; cursor: pointer; }

/* Four destinations with native keyboard/touch disclosures. */
.primary-nav { overflow: visible; }
.nav-group { position: relative; display: flex; align-items: stretch; }
.nav-group > summary { height: 100%; display: flex; align-items: center; gap: 7px; padding: 0 13px; cursor: pointer; list-style: none; color: var(--muted); font-size: .88rem; font-weight: 680; white-space: nowrap; }
.nav-group > summary::-webkit-details-marker { display: none; }
.nav-group.is-active > summary, .nav-group[open] > summary { color: var(--ice); background: rgba(124,231,255,.06); }
.nav-dropdown { position: absolute; top: calc(100% + 4px); left: 0; width: 290px; padding: 8px; border: 1px solid var(--line); border-radius: 14px; background: #0b1b30; box-shadow: 0 16px 40px #0009; z-index: 110; }
.nav-dropdown .nav-tab { display: block; text-align: left; width: 100%; padding: 13px; border-radius: 8px; white-space: normal; }
.nav-dropdown .nav-tab:hover, .nav-dropdown .nav-tab.is-active { background: rgba(124,231,255,.08); }
.nav-dropdown .nav-tab::after { display: none; }
.nav-dropdown small { display: block; margin-top: 4px; color: var(--muted); font-weight: 400; font-size: .85rem; }
@media(min-width:1041px) { .primary-nav > .nav-section:last-child .nav-dropdown { left: auto; right: 0; } }
.nav-group > summary:focus-visible { outline: 2px solid var(--ice); outline-offset: -3px; border-radius: 6px; }
.button.danger { background: #aa304d; border-color: #f18aa1; color: white; }
.button.danger:hover { background: #c03a5a; }
@media (max-width: 480px) {
  .primary-nav { justify-content: space-between; position: relative; }
  .nav-group { position: static; }
  .primary-nav > .nav-tab, .nav-group > summary { padding: 0 11px; }
  .nav-group .nav-dropdown { position: absolute; left: 0; right: 0; top: 100%; width: auto; margin-top: 4px; max-height: 70vh; overflow-y: auto; }
}

input[type="range"].unmarked-range { accent-color:var(--muted); opacity:.55; }
input[type="range"].unmarked-range:focus-visible { opacity:1; outline:2px solid var(--ice); outline-offset:4px; }

/* Learn paths and concise shared notation definitions. */
.panel-notation-list { margin:0; display:grid; gap:.6rem; }
.panel-notation-list > div { display:grid; grid-template-columns:minmax(2.5rem,auto) 1fr; gap:.75rem; align-items:baseline; }
.panel-notation-list dt { font-weight:750; color:var(--ice); }
.panel-notation-list dd { margin:0; font-size:1rem; font-weight:400; line-height:1.5; }
.rules-tools { flex-wrap:wrap; align-items:end; }
.rules-tools .field { min-width:155px; }
.learning-toolbar { display:flex; flex-wrap:wrap; gap:1rem; margin-bottom:1.5rem; padding:1.25rem; border:1px solid var(--line); border-radius:var(--radius-md); background:var(--surface-2); }
.learning-toolbar .field { flex:1; min-width:185px; }
.learning-intro { border-left:3px solid var(--ice); padding:.25rem 1.25rem; margin:1.5rem 0; }
.learning-intro h2 { margin-top:0; }
.learning-section { margin:2rem 0; }
.learning-section > h2 { font-size:1.4rem; }
.learning-section .rule-card { margin:.75rem 0; }
.learning-section .rule-card summary { gap:1rem; }
.lesson-number { color:var(--ice); font-size:.875rem; font-weight:700; }
.learning-section .rule-card h3 { font-size:1.1rem; margin:.2rem 0; }
.learning-section .rule-content p,.learning-section li { line-height:1.7; font-size:1rem; }
.lesson-example { padding:.8rem 1rem; background:var(--surface-2); border-left:2px solid var(--ice); }
.season-roadmap { margin:2rem 0; }
.season-roadmap summary h2 { font-size:1.1rem; margin:0; }
.archive-status { display:flex; flex-wrap:wrap; gap:.75rem; margin:1rem 0; }
@media (max-width:640px) { .rules-tools { width:100%; } .rules-tools > * { width:100%; } .learning-toolbar { padding:1rem; } }

/* An eleven-grade row shared by the builder and panel judging surfaces. */
.goe-buttons { display: grid; grid-template-columns: repeat(11, minmax(0, 1fr)); gap: 3px; min-width: 0; }
.goe-choice { min-width: 0; height: 44px; font-size: .875rem; }
.goe-choice input { margin: 0; min-width: 0; padding: 0; }
.goe-choice:has(input:disabled) { opacity: .55; cursor: default; }
.goe-unmarked { display: block; color: var(--muted); margin-top: 5px; }
.element-goe-cell { min-width: 0; }
.builder-goe-buttons { width: 100%; }
/* Keep each element together, with all eleven GOE grades below its details.
   Retaining one data-row-id row preserves editing, focus and historical locks. */
@media screen and (min-width: 1001px) {
  .element-table, .element-table tbody { display: block; }
  .element-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .element-table tbody tr {
    display: grid;
    grid-template-columns: 4rem minmax(0,1.25fr) minmax(0,2.3fr) minmax(0,.65fr) minmax(0,.85fr) 3.25rem minmax(0,.9fr) minmax(0,1.7fr) 2rem;
    grid-template-areas: "order purpose code info base bonus score notes actions" "goe goe goe goe goe goe goe goe goe";
    gap: 16px 12px; padding: 18px 14px;
    border-bottom: 1px solid var(--line-strong); align-items: start;
  }
  .element-table td { display: block; min-width: 0; border: 0; padding: 0; }
  .element-table td[data-label]::before { content: attr(data-label); display: block; font-size: .875rem; color: var(--muted); margin-bottom: 7px; }
  .element-table .element-order-cell { grid-area: order; }
  .element-table .requirement-cell { grid-area: purpose; }
  .element-table .element-code-cell { grid-area: code; }
  .element-table .element-info-cell { grid-area: info; }
  .element-table .element-base-cell { grid-area: base; }
  .element-table .x-cell { grid-area: bonus; }
  .element-table .element-score-cell { grid-area: score; text-align: right; }
  .element-table .element-notes-cell { grid-area: notes; }
  .element-table .element-actions-cell { grid-area: actions; align-self: center; }
  .element-table .element-goe-cell { grid-area: goe; border-top: 1px solid var(--line); padding-top: 12px; }
  .element-table .element-goe-cell .assist-launch { margin-top: 8px; }
  .element-table .row-icon-button { min-width: 30px; min-height: 32px; }
  .element-table .score-value { display: block; min-height: 44px; padding: 8px 0; }
  .element-table .x-cell input { width: 24px; height: 44px; }
  .element-table textarea { min-height: 64px; }
}
/* Shared panels use the same full-width grade row at every screen size. */
.panel-mark-row > .goe-buttons { width: 100%; flex: 0 0 100%; }
.panel-mark-row > .panel-call { min-width: 0; }
.panel-mark-row > .panel-call > div { min-width: 0; }
@media screen and (max-width: 1000px) {
  .element-table tr { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 10px; }
  .element-table td { min-width: 0; }
  .element-table td::before { font-size: .875rem; }
  .element-table .element-order-cell { grid-column: 1; grid-row: 1; }
  .element-table .requirement-cell { grid-column: 2 / -1; grid-row: 1; }
  .element-table .element-code-cell { grid-column: 1 / 4; grid-row: 2; }
  .element-table .x-cell { grid-column: 4; grid-row: 2; text-align: right; }
  .element-table .x-cell input { width: 24px; height: 44px; margin-right: 8px; }
  .element-table .element-info-cell { grid-column: 1; grid-row: 3; }
  .element-table .element-base-cell { grid-column: 2; grid-row: 3; }
  .element-table .element-score-cell { grid-column: 3 / -1; grid-row: 3; text-align: right; }
  .element-table .element-goe-cell { grid-column: 1 / -1; grid-row: 4; }
  .element-table .element-notes-cell { grid-column: 1 / 4; grid-row: 5; }
  .element-table .element-actions-cell { grid-column: 4; grid-row: 5; align-self: end; }
  .element-table .code-input { max-width: 100%; }
  .element-table .score-value { display: block; min-height: 44px; padding: 7px 0; }
  .element-table .row-icon-button { min-width: 32px; min-height: 36px; }
  .element-table .requirement-cell small, .element-table .code-status, .element-table .base-value-hint { font-size: .875rem; }
}
@media screen and (max-width: 540px) {
  #panel-builder .workspace-main > .card { padding: 14px; }
  .element-table tr { padding: 12px; gap: 12px 8px; }
  .element-table input:not([type=radio]), .element-table textarea { font-size: 1rem; }
  .element-table .code-entry { gap: 5px; }
  .build-code-button { flex-basis: 48px; }
  .goe-buttons { gap: 2px; }
  .goe-choice { border-radius: 5px; }
}
@media screen and (max-width: 360px) {
  #panel-builder .workspace-main > .card { padding: 10px; }
  .element-table tr { padding: 8px; gap: 10px 6px; }
  .goe-buttons { gap: 1px; }
}
@media print {
  .builder-goe-buttons { display: block; }
  .builder-goe-buttons .goe-choice:not(.selected) { display: none; }
  .builder-goe-buttons .goe-choice.selected { height: auto; border: 0; background: transparent; color: #111; }
}

.component-card[hidden] { display: none; }