/* ============ UNBIFY Discover — interactive experience layer ============ */

.dx {
  position: fixed; inset: 0; z-index: 110;
  background: radial-gradient(95% 95% at 50% 44%, #fcf6ea 0%, #f8eed9 58%, #f2e2c6 100%);
  visibility: hidden; opacity: 0;
  transition: opacity 1s ease, visibility 0s linear 1s;
  overflow: hidden;
  font-family: var(--body-serif);
}
body.dx-open .dx { visibility: visible; opacity: 1; transition: opacity 1s ease .2s; }

.dx-haze {
  position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(55% 45% at 60% 30%, rgba(250,232,196,.7) 0%, rgba(250,232,196,0) 70%);
  animation: hazeBreathe 11s ease-in-out infinite;
}
.dx-brand { position: absolute; top: 30px; left: 40px; z-index: 5; opacity: .9; }
.dx-brand .brand-img { height: 44px; }
.dx-chapter {
  position: absolute; top: 44px; right: 44px; z-index: 5;
  font-family: var(--sans); font-size: 10.5px; letter-spacing: .4em; text-transform: uppercase;
  color: #ab9668;
}
.dx-progress {
  position: absolute; left: 0; bottom: 0; height: 2px; width: 0%;
  background: linear-gradient(to right, rgba(201,167,110,.0), rgba(201,167,110,.8));
  transition: width 1.2s cubic-bezier(.3,.6,.3,1); z-index: 5;
}

/* stage */
.dx-stage {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  padding: 9vh 6vw;
}
.dx-scene { width: min(1060px, 100%); display: flex; flex-direction: column; align-items: center; text-align: center; }
.dx-scene.leaving { opacity: 0; transform: translateY(-14px); transition: opacity .5s ease, transform .5s ease; }
.dx-scene.entering { opacity: 0; transform: translateY(16px); }
.dx-scene.entered { opacity: 1; transform: translateY(0); transition: opacity .9s ease, transform .9s cubic-bezier(.3,.6,.3,1); }

.dx-headline {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(30px, 4.6vh, 52px); line-height: 1.16;
  color: transparent;
  background: linear-gradient(178deg, #a9853f 8%, #86642e 62%, #74561f 100%);
  -webkit-background-clip: text; background-clip: text;
  max-width: 21em;
}
.dx-support { margin-top: 14px; font-size: clamp(16px, 2.3vh, 20px); color: #6e655b; line-height: 1.55; max-width: 34em; }

/* Safari paints background-clip:text wrong when the clipped element's
   DESCENDANTS carry transforms or filters: every word-by-word headline
   rendered as a pile of superimposed glyphs at the page corner. Each word
   therefore clips its own gradient (self-transforms are safe), and the
   parent drops its background whenever word spans are present. */
.dx-headline:has(.dx-word) { background: none; }
.dx-word {
  display: inline-block; opacity: 0; filter: blur(3px); transform: translateY(6px);
  background: linear-gradient(178deg, #a9853f 8%, #86642e 62%, #74561f 100%);
  -webkit-background-clip: text; background-clip: text;
}
.dx-word.in { opacity: 1; filter: blur(0); transform: translateY(0); transition: opacity .5s ease, filter .5s ease, transform .5s ease; }

/* ---------- visual choice ---------- */
.dx-scenes { margin-top: 5vh; display: flex; gap: 14px; width: 100%; justify-content: center; }
.dv-scene {
  position: relative; flex: 1 1 0; max-width: 220px; height: min(300px, 38vh);
  border: none; cursor: pointer; border-radius: 130px 130px 18px 18px;
  overflow: hidden; padding: 0;
  box-shadow: 0 4px 26px rgba(170,130,66,.14), inset 0 0 0 1px rgba(201,167,110,.35);
  transition: transform .55s cubic-bezier(.3,.7,.3,1), box-shadow .55s ease, flex-grow .55s ease;
  animation: sceneIn .9s cubic-bezier(.3,.6,.3,1) both;
}
.dv-scene:nth-child(2) { animation-delay: .08s; } .dv-scene:nth-child(3) { animation-delay: .16s; }
.dv-scene:nth-child(4) { animation-delay: .24s; } .dv-scene:nth-child(5) { animation-delay: .32s; }
@keyframes sceneIn { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }
.dv-scene:hover { transform: translateY(-8px) scale(1.02); box-shadow: 0 12px 40px rgba(180,130,60,.24), inset 0 0 0 1px rgba(216,160,84,.6); }
.dv-scene.picked { transform: scale(1.05); box-shadow: 0 12px 48px rgba(216,148,72,.4), inset 0 0 0 2px rgba(232,118,60,.7); }
.dv-scene .art { position: absolute; inset: 0; }
.dv-scene .lbl {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 14px 10px 16px;
  font-family: var(--sans); font-size: 11px; letter-spacing: .18em; text-transform: uppercase;
  color: #5d5347; background: linear-gradient(to top, rgba(252,246,234,.95), rgba(252,246,234,0));
}

/* motif art — soft sepia worlds in pure CSS */
.m-mountain { background:
  linear-gradient(165deg, transparent 44%, #c3a77c 44.5%, #b3946a 58%, transparent 58.5%),
  linear-gradient(195deg, transparent 52%, #d0b68c 52.5%, #bda07a 62%, transparent 62.5%),
  linear-gradient(to bottom, #f4e8ca 0%, #ecdcba 60%, #d8c49a 100%); }
.m-sea { background:
  radial-gradient(26% 14% at 62% 48%, #f9ecc9 0%, rgba(249,236,201,0) 90%),
  repeating-linear-gradient(to bottom, transparent 0 12px, rgba(255,246,222,.25) 12px 13px),
  linear-gradient(to bottom, #f2e6ca 52%, #d9c49c 53%, #cbb28a 78%, #c0a67c 100%); }
.m-city { background: linear-gradient(to bottom, #f1e3c6 40%, #e4d2ae 41%, #b1946a 42%, #cdb389 55%, #a8875f 56%, #dbc8a2 70%, #baa075 71%, #ceb68c 100%); }
.m-library { background: repeating-linear-gradient(to right, #cdb287 0 16%, #b79768 16% 19%, #d5bc92 19% 34%); }
.m-workshop { background:
  radial-gradient(42% 34% at 50% 58%, #f8e7b6 0%, rgba(248,231,182,0) 70%),
  linear-gradient(to bottom, transparent 72%, #83684a 73%, #75593f 100%),
  linear-gradient(to bottom, #cdb389, #a58a60); }
.m-stage { background:
  radial-gradient(38% 52% at 50% 40%, #fbeecb 0%, rgba(251,238,203,.5) 55%, rgba(251,238,203,0) 72%),
  linear-gradient(to bottom, transparent 76%, #7d6547 77%, #6f5940 100%),
  linear-gradient(to bottom, #b3966c, #8e7350); }
.m-garden { background: radial-gradient(40% 30% at 30% 40%, #eeddb6 0%, transparent 70%), radial-gradient(50% 36% at 70% 66%, #c2ab7e 0%, transparent 70%), linear-gradient(to bottom, #ecdcba, #b59c72); }
.m-market { background: repeating-linear-gradient(100deg, #e6d3a9 0 12%, #d5ba8a 12% 24%), linear-gradient(to bottom, #f0e1c0, #c3a778); background-blend-mode: multiply; }
.m-studio { background: linear-gradient(120deg, #f3e6c6 0 40%, #e2cfa4 41% 60%, #cdb287 61% 100%); }
.m-night { background: radial-gradient(30% 20% at 68% 26%, #f7ecd0 0%, transparent 60%), linear-gradient(to bottom, #b59a6e, #8a7050); }
.m-path { background: linear-gradient(to bottom, #efe0bd 55%, #c9ad82 56%, #b0925f 100%), radial-gradient(20% 60% at 50% 100%, #e5d2a6 0%, transparent 70%); background-blend-mode: normal; }
.m-harbor { background: linear-gradient(to bottom, #f2e5c8 48%, #d3ba8f 49%, #c1a67a 72%, #cbb185 73%, #b79a6c 100%); }

/* ---------- scenario choice ---------- */
.dx-options { margin-top: 4.5vh; display: flex; flex-direction: column; gap: 14px; align-items: center; }
.dx-opt {
  background: none; border: none; cursor: pointer;
  font-family: var(--serif); font-weight: 500; font-size: clamp(19px, 2.7vh, 25px);
  color: #7a6c58; padding: 6px 20px; position: relative;
  opacity: 0; transform: translateY(12px);
  transition: color .4s ease, transform .4s ease;
}
.dx-opt.in { opacity: 1; transform: translateY(0); transition: opacity .7s ease, transform .7s cubic-bezier(.3,.6,.3,1), color .4s ease; }
.dx-opt::after {
  content: ""; position: absolute; left: 50%; bottom: 0; height: 1px; width: 0;
  background: #c9a76e; transform: translateX(-50%); transition: width .45s ease;
}
.dx-opt:hover { color: #3f382f; }
.dx-opt:hover::after { width: 70%; }
.dx-opt.picked { color: #8d6a2b; }
.dx-opt.picked::after { width: 100%; background: var(--orange); }

/* ---------- slider (binary tension / spectrum) ---------- */
.dx-slider { margin-top: 8vh; width: min(620px, 88%); }
.dx-poles { display: flex; justify-content: space-between; margin-bottom: 26px; }
.dx-pole { font-family: var(--serif); font-weight: 500; font-size: clamp(18px, 2.6vh, 24px); color: #6d6154; transition: color .4s ease, transform .4s ease; max-width: 42%; }
.dx-pole.active { color: #8d6a2b; transform: scale(1.06); }
.dx-track { position: relative; height: 2px; background: linear-gradient(to right, rgba(178,146,94,.55), rgba(178,146,94,.55)); border-radius: 1px; }
.dx-track::before, .dx-track::after {
  content: ""; position: absolute; top: -3px; width: 8px; height: 8px; border-radius: 50%;
  background: #cbb088;
}
.dx-track::before { left: -2px; } .dx-track::after { right: -2px; }
.dx-handle {
  position: absolute; top: 50%; left: 50%;
  width: 34px; height: 34px; border-radius: 50%;
  transform: translate(-50%, -50%);
  background: radial-gradient(50% 50% at 42% 38%, #fffdf6 0%, #fbeecd 60%, #f2d9a2 100%);
  box-shadow: 0 2px 16px rgba(200,150,70,.4), 0 0 0 1px rgba(201,167,110,.6);
  cursor: grab; touch-action: none;
  animation: haloBreathe 4s ease-in-out infinite;
}
.dx-handle:active { cursor: grabbing; }
.dx-commit {
  margin-top: 42px; opacity: 0; pointer-events: none;
  background: none; border: 1px solid rgba(201,167,110,.55); border-radius: 40px;
  padding: 12px 30px; cursor: pointer;
  font-family: var(--sans); font-size: 11px; letter-spacing: .3em; text-indent: .3em; text-transform: uppercase;
  color: #8d6a2b; transition: opacity .6s ease, border-color .4s ease, box-shadow .4s ease;
}
.dx-commit.ready { opacity: 1; pointer-events: auto; }
.dx-commit:hover { border-color: rgba(216,150,80,.8); box-shadow: 0 0 24px rgba(226,178,106,.35); }

/* ---------- forced rank / object sort ---------- */
.dx-chips { margin-top: 4vh; display: flex; flex-wrap: wrap; gap: 12px 14px; justify-content: center; max-width: 620px; }
.dx-chip {
  border: 1px solid rgba(178,146,94,.5); background: rgba(253,248,238,.6);
  border-radius: 40px; padding: 11px 22px; cursor: pointer;
  font-family: var(--serif); font-size: clamp(16px, 2.3vh, 20px); color: #6d6154;
  transition: all .45s cubic-bezier(.3,.6,.3,1);
  animation: chipBob 5s ease-in-out infinite;
}
.dx-chip:nth-child(2n) { animation-delay: 1.2s; } .dx-chip:nth-child(3n) { animation-delay: 2.3s; }
@keyframes chipBob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
.dx-chip:hover { border-color: rgba(216,150,80,.7); color: #3f382f; }
.dx-chip.held {
  background: linear-gradient(178deg, #fdf3da, #fae3b2);
  border-color: rgba(232,118,60,.6); color: #8a5f24;
  box-shadow: 0 4px 18px rgba(216,148,72,.3); animation: none; transform: scale(1.04);
}
.dx-keep {
  margin-top: 30px; font-family: var(--sans); font-size: 10.5px; letter-spacing: .3em;
  text-transform: uppercase; color: #ab9668;
}

/* ---------- micro reflection ---------- */
.dx-input-wrap { margin-top: 6vh; width: min(560px, 90%); position: relative; }
.dx-input {
  width: 100%; background: none; border: none; border-bottom: 1px solid rgba(178,146,94,.55);
  font-family: var(--serif); font-size: clamp(20px, 3vh, 26px); color: #4c443b;
  padding: 10px 4px 14px; text-align: center; outline: none;
  transition: border-color .4s ease;
}
.dx-input:focus { border-color: rgba(216,150,80,.85); }
.dx-input::placeholder { color: #b3a48d; font-style: italic; }
.dx-skip {
  margin-top: 34px; background: none; border: none; cursor: pointer;
  font-family: var(--sans); font-size: 10px; letter-spacing: .28em; text-transform: uppercase;
  color: #b3a48d;
}
.dx-skip:hover { color: var(--orange); }

/* ---------- map and compare cards (My UNBIFY) ---------- */
.dx-lives { margin-top: 4vh; display: flex; gap: 18px; width: 100%; align-items: stretch; }
.dx-life {
  flex: 1 1 0; text-align: left; background: rgba(253,249,240,.55);
  border: 1px solid rgba(201,167,110,.4); border-radius: 6px;
  padding: 26px 24px; cursor: pointer;
  transition: transform .5s cubic-bezier(.3,.7,.3,1), box-shadow .5s ease, border-color .5s ease;
  opacity: 0; transform: translateY(20px); animation: sceneIn 1s cubic-bezier(.3,.6,.3,1) both;
}
.dx-life:nth-child(2) { animation-delay: .5s; } .dx-life:nth-child(3) { animation-delay: 1s; }
.dx-life:hover { transform: translateY(-6px); box-shadow: 0 14px 40px rgba(170,124,58,.18); border-color: rgba(216,150,80,.6); }
.dx-life.picked { border-color: rgba(232,118,60,.75); box-shadow: 0 14px 44px rgba(216,148,72,.3); }
.dx-life h3 { font-family: var(--serif); font-weight: 500; font-size: clamp(21px, 2.8vh, 27px); color: #8d6a2b; }
.dx-life .ess { margin-top: 4px; font-style: italic; font-size: 15px; color: #97876e; }
.dx-life dl { margin-top: 16px; }
.dx-life dt { font-family: var(--sans); font-size: 8.5px; letter-spacing: .26em; text-transform: uppercase; color: #ab9668; margin-top: 12px; }
.dx-life dd { font-size: 14.5px; line-height: 1.5; color: #5d5347; margin-top: 3px; }
.dx-life .meta { margin-top: 14px; display: flex; gap: 14px; font-family: var(--sans); font-size: 10px; letter-spacing: .1em; color: #a3762f; text-transform: uppercase; }

/* generic pill option */
.dx-pill {
  background: none; border: 1px solid rgba(178,146,94,.55); border-radius: 40px;
  padding: 12px 26px; cursor: pointer;
  font-family: var(--sans); font-size: 11px; letter-spacing: .24em; text-indent: .24em; text-transform: uppercase;
  color: #7a6248; transition: all .4s ease;
}
.dx-pill:hover { border-color: rgba(216,150,80,.85); color: #8a5f24; box-shadow: 0 0 22px rgba(226,178,106,.3); }
.dx-pill.picked { background: linear-gradient(178deg, #fdf3da, #fae3b2); border-color: rgba(232,118,60,.6); color: #8a5f24; }


/* responsive */
@media (max-width: 880px) {
  .dx-scenes { flex-wrap: wrap; }
  .dv-scene { flex: 1 1 40%; max-width: none; height: 150px; border-radius: 75px 75px 12px 12px; }
  .dx-lives { flex-direction: column; }
  .dx-stage { padding: 10vh 6vw 8vh; align-items: flex-start; overflow-y: auto; }
  .dx-scene { min-height: 100%; justify-content: center; }
  .dx-brand { left: 22px; top: 20px; } .dx-brand .brand-img { height: 36px; }
  .dx-chapter { right: 22px; top: 30px; }
}
@media (prefers-reduced-motion: reduce) {
  .dv-scene, .dx-chip, .dx-handle, .dx-life { animation: none !important; }
  .dx-scene.entered, .dx-word.in, .dx-opt.in { transition-duration: .01s !important; }
}

/* ============ the completion doorway — Discover → My UNBIFY ============
   A threshold, not a result: calm serif hero, one clear way in, the chapter
   thread drawn onward to the space it feeds. Motion is arrival only. */
.dx-door { width: min(720px, 100%); padding-block: 2vh; }
.dx-door-motif {
  display: flex; flex-direction: column; gap: 12px; width: min(400px, 86%);
  margin-bottom: clamp(30px, 5.5vh, 56px);
  animation: doorIn 1.1s cubic-bezier(.3,.6,.3,1) .1s both;
}
.dx-door-track { display: flex; align-items: center; gap: 14px; }
.dx-door-dots { display: flex; gap: 8px; flex: none; }
.dx-door-dots i { width: 6px; height: 6px; border-radius: 50%; background: #c9a76e; }
.dx-door-line {
  position: relative; flex: 1; height: 1px;
  background: linear-gradient(to right, rgba(201,167,110,.8), rgba(232,118,60,.5));
  transform-origin: left center;
  animation: doorLine 1.4s cubic-bezier(.3,.6,.3,1) .45s both;
}
.dx-door-spark {
  position: absolute; top: 50%; left: 0; width: 40px; height: 8px; margin-top: -4px;
  border-radius: 50%; opacity: 0;
  background: radial-gradient(closest-side, rgba(255,238,206,1), rgba(232,160,90,0));
  animation: doorSpark 6s ease-in-out 2.2s infinite;
}
.dx-door-node {
  flex: none; width: 18px; height: 18px; border-radius: 50%;
  border: 1px solid rgba(232,118,60,.55);
  background: radial-gradient(circle, #fffaf0 0 32%, #f3d9a8 34% 100%);
  animation: doorIn .9s ease 1.2s both, doorBreathe 4.5s ease-in-out 2.1s infinite;
}
.dx-door-ends {
  display: flex; justify-content: space-between;
  font-family: var(--sans); font-size: 10.5px; letter-spacing: .26em; text-transform: uppercase;
  color: #ab9668;
}
.dx-door-eyebrow {
  font-family: var(--sans); font-weight: 500; font-size: 12px; letter-spacing: .34em;
  text-indent: .34em; text-transform: uppercase; color: #a3762f;
  animation: doorIn 1s cubic-bezier(.3,.6,.3,1) .35s both;
}
/* the gradient clips on the heading itself, which is the element that moves —
   self-transforms are Safari-safe (see .dx-word) */
.dx-door-h {
  margin-top: 18px; font-family: var(--serif); font-weight: 500;
  font-size: clamp(38px, 5vw, 58px); line-height: 1.08; letter-spacing: -.005em;
  color: transparent;
  background: linear-gradient(178deg, #a9853f 8%, #86642e 62%, #74561f 100%);
  -webkit-background-clip: text; background-clip: text;
  animation: doorIn 1.2s cubic-bezier(.3,.6,.3,1) .5s both;
}
.dx-door-h:focus { outline: none; }
.dx-door-lines {
  margin-top: clamp(18px, 3vh, 26px); max-width: 32em;
  font-family: var(--body-serif); font-size: clamp(17px, 1.5vw, 19px); line-height: 1.6; color: #6e655b;
  animation: doorIn 1.1s cubic-bezier(.3,.6,.3,1) .85s both;
}
.dx-door-lines p + p { margin-top: 4px; }
.dx-door-cta {
  margin-top: clamp(34px, 6vh, 56px); min-height: 52px; padding: 15px 34px 15px 38px;
  display: inline-flex; align-items: center; gap: 14px; cursor: pointer;
  border: 1px solid rgba(201,167,110,.75); border-radius: 40px;
  background: linear-gradient(180deg, #fffaf0 0%, #fbefd8 100%);
  box-shadow: 0 6px 28px rgba(190,140,70,.16);
  font-family: var(--sans); font-weight: 500; font-size: 14px; letter-spacing: .24em;
  text-transform: uppercase; color: #7a5a22;
  transition: border-color .4s ease, box-shadow .4s ease, transform .4s ease;
  animation: doorIn 1s cubic-bezier(.3,.6,.3,1) 1.15s both;
}
.dx-door-arrow { color: var(--orange); letter-spacing: 0; transition: transform .4s cubic-bezier(.3,.6,.3,1); }
.dx-door-cta:hover { border-color: rgba(216,150,80,.9); box-shadow: 0 8px 34px rgba(226,160,90,.3); }
.dx-door-cta:hover .dx-door-arrow, .dx-door-cta:focus-visible .dx-door-arrow { transform: translateX(4px); }
.dx-door-cta:focus-visible { outline: 2px solid var(--orange); outline-offset: 4px; }
.dx-door-cta:active { transform: translateY(1px); }
.dx-door-cta[aria-disabled="true"] { cursor: progress; opacity: .75; }
.dx-door-back {
  margin-top: 14px; padding: 10px 14px; background: none; border: 0; cursor: pointer;
  font-family: var(--sans); font-size: 12px; letter-spacing: .14em; color: #9a8a70;
  text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 4px;
  transition: color .3s ease, text-decoration-color .3s ease;
  animation: doorIn 1s ease 1.4s both;
}
.dx-door-back:hover { color: #6e655b; text-decoration-color: rgba(154,138,112,.5); }
.dx-door-back:focus-visible { outline: 2px solid rgba(201,167,110,.9); outline-offset: 2px; border-radius: 6px; }
@keyframes doorIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
@keyframes doorLine { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes doorSpark {
  0% { left: 0; opacity: 0; } 12% { opacity: 1; }
  62% { left: calc(100% - 40px); opacity: .85; } 78%, 100% { left: calc(100% - 40px); opacity: 0; }
}
@keyframes doorBreathe {
  0%, 100% { box-shadow: 0 0 0 5px rgba(232,170,100,.10), 0 0 18px rgba(232,150,80,.22); }
  50% { box-shadow: 0 0 0 8px rgba(232,170,100,.14), 0 0 30px rgba(232,150,80,.38); }
}
@media (max-width: 640px) {
  .dx-door { padding-block: 4vh 2vh; }
  .dx-door-motif { width: min(300px, 88%); margin-bottom: 28px; }
  .dx-door-ends { font-size: 9.5px; letter-spacing: .2em; }
  .dx-door-eyebrow { font-size: 11px; letter-spacing: .26em; text-indent: .26em; }
  .dx-door-h { font-size: clamp(32px, 9.4vw, 42px); }
  .dx-door-lines { font-size: 17px; }
  .dx-door-cta { width: 100%; max-width: 360px; justify-content: center; padding: 15px 20px;
                 letter-spacing: .2em; }
}
@media (prefers-reduced-motion: reduce) {
  .dx-door-motif, .dx-door-line, .dx-door-node, .dx-door-eyebrow, .dx-door-h,
  .dx-door-lines, .dx-door-cta, .dx-door-back { animation: none !important; }
  .dx-door-spark { display: none; }
  .dx-door-node { box-shadow: 0 0 0 6px rgba(232,170,100,.12), 0 0 22px rgba(232,150,80,.3); }
}

/* ============ PART TWO — the persistent workspace ============ */
.dx-ws { width: min(980px, 100%); text-align: center; padding: 4vh 0 10vh; }
.ws-head { display: flex; flex-direction: column; gap: 8px; align-items: center; }
.ws-kicker {
  font-family: var(--serif); font-weight: 500; font-size: clamp(30px, 4.4vh, 46px);
  background: linear-gradient(178deg, #a9853f 8%, #86642e 62%, #74561f 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.ws-clarity { font-family: var(--sans); font-size: 12px; letter-spacing: .3em; text-transform: uppercase; color: #ab9668; }
.ws-clarity em { font-style: normal; color: var(--orange); }
.ws-tabs { margin-top: 4vh; display: flex; gap: 34px; justify-content: center; border-bottom: 1px solid rgba(201,167,110,.35); padding-bottom: 0; }
.ws-tab {
  background: none; border: none; cursor: pointer; padding: 10px 6px 14px; position: relative;
  font-family: var(--sans); font-size: 12px; letter-spacing: .3em; text-indent: .3em; text-transform: uppercase;
  color: #a3947e; transition: color .4s ease;
}
.ws-tab::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--orange); transform: scaleX(0); transition: transform .45s cubic-bezier(.3,.6,.3,1); }
.ws-tab.active { color: #6d5a3a; }
.ws-tab.active::after { transform: scaleX(1); }
.ws-body { margin-top: 4.5vh; text-align: center; }
/* My UNBIFY — the activation layer above the tools */
.ws-mu {
  max-width: 620px; margin: 0 auto 4vh; padding: 22px 26px 24px; text-align: center;
  background: rgba(253,249,240,.55); border: 1px solid rgba(201,167,110,.4);
  border-radius: 8px; box-shadow: 0 10px 34px rgba(160,120,60,.08);
}
.ws-mu-summary { font-family: var(--serif); font-size: 17px; color: #6d5a3a; line-height: 1.5; }
.ws-mu-k {
  margin-top: 16px; font-family: var(--sans); font-size: 12px; letter-spacing: .22em;
  text-transform: uppercase; color: #ab9668;
}
.ws-mu-name { margin-top: 6px; font-family: var(--serif); font-size: 21px; color: #74561f; }
.ws-mu-why { margin-top: 6px; font-size: 13.5px; color: #8a795c; line-height: 1.55; }
.ws-mu-none { margin-top: 12px; font-size: 13.5px; color: #8a795c; line-height: 1.55; }
.ws-mu-primary .ws-mu-go { margin-top: 12px; }
.ws-mu-secondary { margin-top: 8px; display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.ws-mu-popup { margin-top: 18px; padding-top: 16px; border-top: 1px dashed rgba(201,167,110,.45); }
.ws-mu-q { margin-top: 6px; font-family: var(--serif); font-size: 16px; color: #6d5a3a; }
.ws-mu-opts { margin-top: 10px; display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }

.ws-actions { display: flex; flex-direction: column; gap: 12px; max-width: 620px; margin: 0 auto; }
.ws-action {
  display: flex; align-items: baseline; gap: 16px; text-align: left;
  background: rgba(253,249,240,.5); border: 1px solid rgba(201,167,110,.35); border-radius: 6px;
  padding: 18px 22px; cursor: pointer;
  transition: transform .4s cubic-bezier(.3,.7,.3,1), border-color .4s ease, box-shadow .4s ease;
  animation: sceneIn .7s cubic-bezier(.3,.6,.3,1) both;
}
.ws-action:hover { transform: translateX(6px); border-color: rgba(216,150,80,.6); box-shadow: 0 8px 28px rgba(170,124,58,.14); }
.ws-action .lbl { font-family: var(--serif); font-weight: 500; font-size: clamp(18px, 2.5vh, 22px); color: #55483a; white-space: nowrap; }
.ws-action .hint { flex: 1; font-size: 13.5px; color: #97876e; font-style: italic; }
.ws-action svg { width: 22px; color: #b08d4f; flex: 0 0 auto; align-self: center; }
.ws-detail { max-width: 860px; margin: 0 auto; }
.ws-detail-head {
  font-family: var(--serif); font-weight: 500; font-size: clamp(24px, 3.4vh, 34px);
  color: #8d6a2b; margin-bottom: 18px;
}
.ws-single-title { font-family: var(--serif); font-size: clamp(20px, 2.8vh, 26px); color: #55483a; margin-top: 8px; }
.ws-single-text { margin-top: 14px; font-size: clamp(16px, 2.3vh, 20px); line-height: 1.6; color: #6e655b; max-width: 36em; margin-left: auto; margin-right: auto; }
.ws-list { display: flex; flex-direction: column; gap: 14px; margin-top: 10px; }
.ws-item { font-family: var(--serif); font-size: clamp(17px, 2.4vh, 21px); line-height: 1.5; color: #5d5347; }
.ws-note { margin-top: 22px; font-style: italic; font-size: 14px; color: #97876e; }
.ws-back { margin-top: 30px; }
.ws-life-acts { margin-top: 16px; display: flex; gap: 10px; flex-wrap: wrap; }
.ws-life-acts .dx-pill { font-size: 12px; padding: 9px 16px; }
.ws-question { min-height: 40vh; display: flex; flex-direction: column; align-items: center; justify-content: center; }
@media (max-width: 880px) {
  .ws-action { flex-direction: column; gap: 4px; }
  .ws-action .lbl { white-space: normal; }
}

/* ============ experience refinement: narrative layer ============ */

/* evidence constellation — memory fragments, never analytics tags */
.dx-field { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.dx-frag {
  position: absolute; font-family: var(--serif); font-style: italic;
  font-size: clamp(13px, 1.9vh, 17px); color: #8d6a2b;
  /* only vertical centring: horizontal placement is edge-anchored in JS so a
     fragment can never hang off the side and be clipped */
  opacity: 0; transform: translateY(-50%);
  max-width: 22vw; overflow: hidden; text-overflow: ellipsis;
  transition: opacity 2.4s ease, left 2.6s cubic-bezier(.3,.5,.2,1), top 2.6s cubic-bezier(.3,.5,.2,1);
  animation: fragDrift 14s ease-in-out infinite alternate;
  white-space: nowrap;
}
.dx-frag.fading { opacity: 0 !important; }
@keyframes fragDrift { from { margin-top: 0; } to { margin-top: -10px; } }

/* chapter thread — narrative movement, never question counts */
.dx-thread {
  position: absolute; left: 44px; bottom: 26px; z-index: 5;
  display: flex; flex-direction: column; gap: 8px;
}
.dx-thread .tl { font-family: var(--sans); font-size: 9px; letter-spacing: .32em; text-transform: uppercase; color: #ab9668; }
.dx-thread .tline { display: flex; gap: 5px; align-items: center; }
.dx-thread i {
  display: block; width: 22px; height: 1.5px; background: rgba(178,146,94,.3);
  transition: background .8s ease;
}
.dx-thread i.on { background: rgba(200,150,84,.85); }
.dx-thread i.on:last-of-type { position: relative; }

/* micro-bridge — a quiet narrative reason */
.dx-bridge {
  font-family: var(--serif); font-style: italic;
  font-size: clamp(15px, 2.2vh, 19px); color: #97876e;
  margin-bottom: 20px; opacity: 0; transform: translateY(6px);
  transition: opacity .9s ease, transform .9s ease;
}
.dx-bridge.in { opacity: 1; transform: translateY(0); }

/* back — reopen the previous answer; one step, quietly offered */
.dx-back {
  background: none; border: none; cursor: pointer; padding: 6px 10px;
  margin-bottom: 14px; align-self: center;
  font-family: var(--sans); font-size: 10px; letter-spacing: .26em; text-indent: .26em;
  text-transform: uppercase; color: #ab9668;
  opacity: 0; transform: translateY(4px);
  transition: opacity .8s ease, transform .8s ease, color .3s ease;
}
.dx-back.in { opacity: .8; transform: translateY(0); }
.dx-back:hover { color: #8d6a2b; opacity: 1; }
.dx-back[aria-disabled="true"] { pointer-events: none; opacity: .3; }
.dx-back .dx-back-arrow { text-indent: 0; letter-spacing: 0; margin-right: 4px; }
.dx-back.dx-back-failed { color: #a3552f; }
.dx-back.dx-back-failed::after { content: " — didn't go through"; text-transform: none; letter-spacing: .06em; }

/* revisit — a reopened question shows the answer being replaced */
.dx-revisit-note {
  font-family: var(--sans); font-size: 10.5px; letter-spacing: .14em;
  color: #a3762f; margin-bottom: 16px;
  opacity: 0; transform: translateY(4px);
  transition: opacity .8s ease, transform .8s ease;
}
.dx-revisit-note.in { opacity: .85; transform: translateY(0); }
.dx-pill.dx-prev, .dx-chip.dx-prev, .dv-scene.dx-prev {
  border-color: rgba(216,150,80,.75);
  box-shadow: 0 0 0 1px rgba(216,150,80,.35), 0 0 18px rgba(226,178,106,.22);
}
.dx-opt.dx-prev { color: #8d6a2b; }
.dx-prev-tag {
  display: block; margin-top: 3px;
  font-family: var(--sans); font-size: 8.5px; letter-spacing: .26em; text-indent: .26em;
  text-transform: uppercase; color: #ab9668;
}
.dx-pill .dx-prev-tag, .dx-chip .dx-prev-tag { margin-top: 1px; }

/* help mode — a scene the choice happens in, never a hint, never a grade */
.dx-help {
  margin: 18px auto 4px; max-width: 540px; text-align: left;
  border-left: 2px solid rgba(163, 118, 47, .35); padding: 4px 0 4px 18px;
  animation: softIn 1s ease both;
}
.dx-help-label {
  font-family: var(--sans); font-size: 9px; letter-spacing: .3em; text-transform: uppercase;
  color: #b08a3d; margin-bottom: 8px;
}
.dx-help-moment {
  font-family: var(--serif); font-size: clamp(15px, 2.1vh, 18px); line-height: 1.55;
  color: #7a5d28;
}
.dx-help-opts { margin: 14px 0 12px; display: flex; flex-direction: column; gap: 9px; }
.dx-help-opt { display: flex; flex-direction: column; gap: 2px; }
.dx-help-opt-label {
  font-family: var(--sans); font-size: 11.5px; letter-spacing: .1em;
  text-transform: uppercase; color: #a3762f;
}
.dx-help-opt-means {
  font-family: var(--sans); font-size: 13.5px; line-height: 1.5; color: #6d5320;
}
.dx-help-close {
  font-family: var(--serif); font-style: italic;
  font-size: clamp(13.5px, 1.8vh, 16px); color: #97794a;
}
.dx-assist {
  position: absolute; left: 50%; bottom: 30px; transform: translateX(-50%) translateY(8px);
  display: flex; align-items: center; gap: 16px; z-index: 8;
  opacity: 0; transition: opacity 1.2s ease, transform 1.2s ease;
  font-family: var(--serif); font-style: italic; font-size: 15px; color: #97876e;
}
.dx-assist.in { opacity: 1; transform: translateX(-50%) translateY(0); }
.dx-assist button {
  background: none; border: 1px solid rgba(178,146,94,.45); border-radius: 30px;
  padding: 7px 16px; cursor: pointer;
  font-family: var(--sans); font-size: 9.5px; letter-spacing: .22em; text-transform: uppercase;
  color: #8d7a58; transition: all .4s ease;
}
.dx-assist button:hover { border-color: rgba(216,150,80,.8); color: #8a5f24; }


@media (max-width: 880px) {
  .dx-thread { left: 22px; bottom: 18px; }
  .dx-frag { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .dx-frag { animation: none; transition-duration: .01s; }
}

/* ============ user-paced chapter closings ============ */
.dx-stage.dx-scroll { align-items: flex-start; overflow-y: auto; }
/* A closing is one argument in three or four moves. At the old 12vh rhythm each
   short sentence claimed a full screen, so reading it meant scrolling past the
   beat you were meant to be holding in mind alongside the next one. It is now
   sized to sit on one screen and centre itself when it fits, and only scrolls
   when a closing genuinely carries more (evidence rows, a quote, the mirror). */
.dx-closingpage {
  min-height: 100%; padding: 5vh 0 6vh;
  display: flex; flex-direction: column; align-items: center;
  /* auto margins centre the beats when they fit and collapse to zero when they
     do not, so a taller closing (evidence rows, a quote) scrolls from its top
     instead of overflowing upward out of reach — which centring alone does */
  justify-content: flex-start;
  gap: 4.5vh;
}
.dx-closingpage > :first-child { margin-top: auto; }
.dx-closingpage > :last-child { margin-bottom: auto; }
.dx-close-sec {
  max-width: 720px; text-align: center;
  opacity: 0; transform: translateY(18px);
  transition: opacity 1.1s ease, transform 1.1s cubic-bezier(.3,.6,.3,1);
}
.dx-close-sec.in { opacity: 1; transform: translateY(0); }
.dx-close-sec .cs-label {
  font-family: var(--sans); font-size: 9px; letter-spacing: .3em; text-transform: uppercase;
  color: #a3762f; margin-bottom: 8px;
}
.dx-close-sec .cs-text {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(20px, 3.1vh, 31px); line-height: 1.38;
  color: transparent;
  background: linear-gradient(178deg, #a9853f 8%, #86642e 62%, #74561f 100%);
  -webkit-background-clip: text; background-clip: text;
}
.dx-close-cta { opacity: 0; transition: opacity 1s ease; }

.dx-close-cta.in { opacity: 1; }

/* ============ Materialization — structured, still editorial ============ */
/* A summary you take in, not a document you read through. Sections used to
   stack end to end with 10vh between them, so the findings began several
   scrolls below the fold and nothing could be compared side by side. */

/* legacy card styles kept for other surfaces that still use them */
.dx-mat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 9px; }
.dx-mat-card { border: 1px solid rgba(163,118,47,.18); border-radius: 10px; padding: 12px 14px;
  background: rgba(163,118,47,.05); }
.dx-mat-name { font-family: var(--serif); font-size: 15px; line-height: 1.25; color: #6d5320; }
.dx-mat-support { font-family: var(--sans); font-size: 11.5px; line-height: 1.45; color: #8a6f42; margin-top: 5px; }
.dx-mat-basis { font-family: var(--sans); font-size: 10.5px; color: #a98f5e; margin-top: 6px; font-style: italic; }

/* the uncertainty panel: compact rows, quiet accent (§10) */

.dx-mat-gap { border-left: 2px solid rgba(163,118,47,.3); padding-left: 14px; }
.dx-gap-label { font-family: var(--serif); font-size: clamp(16px, 1.4vw, 18px);
  line-height: 1.35; color: #6d5320; }
.dx-gap-why { font-family: var(--sans); font-size: var(--mt-support, 14px); line-height: 1.5;
  color: #8a6f42; margin-top: 4px; }

.dx-pill-quiet { opacity: .6; }

/* live market analysis */
.dx-change-note { font-family: var(--sans); font-size: 12.5px; color: #8a6a2e;
  margin-top: 8px; font-style: italic; }
.dx-evidence-note { font-family: var(--sans); font-size: 12px; color: #a98f5e; margin-top: 6px; }
.dx-freshness { font-family: var(--sans); font-size: 10.5px; letter-spacing: .04em;
  color: #a98f5e; margin-top: 10px; }

/* ============ perceived latency: acknowledgement, thinking, retry ============
   Computation must never read as unresponsiveness — and must never pretend to
   be narrative. Ambient motion for ordinary work; words only when earned. */

/* the chosen thing settles; everything else softens (never looks disabled) */
.dx-chosen {
  transform: scale(1.015);
  transition: transform .28s cubic-bezier(.2,.7,.3,1), box-shadow .28s ease, opacity .28s ease;
  box-shadow: 0 0 0 1px rgba(163,118,47,.42), 0 6px 26px -12px rgba(120,86,30,.5);
  opacity: 1 !important;
}
.dx-softened {
  opacity: .34;
  filter: saturate(.7);
  transition: opacity .42s ease .06s, filter .42s ease .06s;
}
.dx-answered .dx-support, .dx-answered .dx-help { opacity: .5; transition: opacity .4s ease; }
[aria-disabled="true"] { pointer-events: none; }

/* screen memory: the answered scene recedes rather than blanking */
.dx-scene.leaving { opacity: .16; transform: translateY(-6px) scale(.995); }

/* thinking state — a slow breath of light, not a spinner */
.dx-thinking {
  position: fixed; left: 50%; bottom: 12vh; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  opacity: 0; transition: opacity .5s ease; pointer-events: none; z-index: 6;
}
.dx-thinking.ambient, .dx-thinking.with-text { opacity: 1; }
.dx-thinking.out { opacity: 0; }
.dx-thinking-pulse {
  width: 44px; height: 1px; border-radius: 1px;
  background: linear-gradient(90deg, transparent, #a3762f, transparent);
  background-size: 220% 100%;
  animation: dx-breathe 2.6s ease-in-out infinite;
}
@keyframes dx-breathe {
  0%, 100% { background-position: 120% 0; opacity: .35; transform: scaleX(.72); }
  50%      { background-position: -20% 0; opacity: .95; transform: scaleX(1); }
}
.dx-thinking-text {
  font-family: var(--sans); font-size: 12.5px; letter-spacing: .04em;
  color: #9d7f4d; text-align: center; max-width: 34ch; line-height: 1.5;
  opacity: 0; transition: opacity .45s ease;
}
.dx-thinking.with-text .dx-thinking-text { opacity: 1; }

/* honest failure — never leave someone inside a beautiful animation */
.dx-retry { margin-top: 26px; text-align: center; }
.dx-retry-text { font-family: var(--sans); font-size: 13px; color: #9d7f4d; margin-bottom: 14px; }
.dx-scene.dx-failed { opacity: 1 !important; transform: none !important; }

/* screen-reader-only live region */
.dx-live {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

@media (prefers-reduced-motion: reduce) {
  .dx-thinking-pulse { animation: none; opacity: .7; transform: none; }
  .dx-chosen { transform: none; }
  .dx-scene.leaving { transform: none; }
  .dx-softened { transition-duration: .01s; }
}


.dx-explore { text-align: center; }

/* ---- one account, one audit: the keep-which choice ---- */
.dx-claim-choice {
  position: fixed; inset: 0; z-index: 130; display: flex; align-items: center; justify-content: center;
  background: rgba(60, 44, 18, .38); backdrop-filter: blur(4px) grayscale(.7); padding: 24px;
}
.dx-claim-card {
  width: min(480px, 100%); text-align: center;
  background: #fdf8ec; border: 1px solid rgba(163, 118, 47, .3);
  border-radius: 16px; padding: 34px 36px;
  box-shadow: 0 18px 60px rgba(60, 44, 18, .25);
}
.dx-claim-k {
  font-family: var(--sans); font-size: 10.5px; letter-spacing: .3em;
  text-transform: uppercase; color: #a3762f;
}
.dx-claim-q {
  margin-top: 14px; font-family: var(--serif, Georgia, serif);
  font-size: clamp(19px, 2.8vh, 23px); line-height: 1.4; color: #4c443b;
}
.dx-claim-sub {
  margin-top: 8px; font-family: var(--sans); font-size: 13px;
  line-height: 1.6; color: #8a8574;
}
.dx-claim-opts { margin-top: 22px; display: flex; flex-direction: column; gap: 10px; align-items: center; }
.dx-claim-opts .dx-commit { margin: 0; }
.dx-claim-note {
  margin-top: 12px; font-family: var(--sans); font-size: 12px;
  font-style: italic; color: #9d7f4d; min-height: 1.2em;
}

/* ---------------- sign-in: the audit gets an owner ----------------
   The blocking variant greys the whole page out and offers no way past —
   the audit underneath stays visible enough to be worth keeping, unreadable
   enough that signing in is the only way to use it. */
.dx-auth-back {
  /* above #dx (z 110), which itself sits above the intro page */
  position: fixed; inset: 0; z-index: 130; display: flex; align-items: center; justify-content: center;
  background: rgba(60, 44, 18, .38); backdrop-filter: blur(4px) grayscale(.7); padding: 24px;
}

/* our own Google button — drawn with the modal, never waiting on Google */
.dx-auth-gbtn {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  width: 100%; padding: 12px 16px; border-radius: 999px; cursor: pointer;
  background: #fff; border: 1px solid rgba(163, 118, 47, .35);
  font-family: var(--sans); font-size: 14px; color: #3c3733;
  transition: box-shadow .25s ease, border-color .25s ease;
}
.dx-auth-gbtn:hover:not(:disabled) {
  border-color: rgba(163, 118, 47, .6);
  box-shadow: 0 2px 14px rgba(90, 66, 24, .12);
}
.dx-auth-gbtn:disabled { opacity: .7; cursor: default; }
.dx-gicon { width: 18px; height: 18px; flex: 0 0 auto; }

/* the remembered account inside the auth modal: explicit, never silent */
.dx-auth-continue { width: 100%; margin: 14px 0 4px; }
.dx-auth-alt {
  font-family: var(--sans); font-size: 11px; letter-spacing: .06em;
  color: #a3762f; margin-bottom: 10px;
}

/* who is signed in — visible on every owned surface, with the way out.
   Below the modals (130), above the experience overlay (110). */
.dx-ident {
  position: fixed; right: 12px; bottom: 12px; z-index: 118;
  display: flex; align-items: center; gap: 10px;
  padding: 7px 12px; border-radius: 999px;
  background: rgba(250, 243, 230, .95);
  border: 1px solid rgba(163, 118, 47, .3);
  box-shadow: 0 2px 12px rgba(90, 66, 24, .12);
  font-family: var(--sans); font-size: 11.5px; color: #7d5f26;
  max-width: min(320px, calc(100vw - 24px));
}
.dx-ident-who { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dx-ident-out {
  background: none; border: none; cursor: pointer; padding: 2px 0;
  font-family: var(--sans); font-size: 10.5px; letter-spacing: .08em;
  text-transform: uppercase; color: #a3762f; white-space: nowrap;
}
.dx-ident-out:hover, .dx-ident-out:focus-visible { color: #8a5a2e; text-decoration: underline; }
.dx-auth-back.blocking {
  background: rgba(52, 38, 15, .55);
  -webkit-backdrop-filter: blur(9px); backdrop-filter: blur(9px);
}
.dx-auth {
  position: relative;
  background: #fdf6e6; border: 1px solid rgba(163, 118, 47, .3); border-radius: 14px;
  padding: 30px 32px 26px; width: min(400px, 92vw); text-align: center;
  box-shadow: 0 18px 60px rgba(90, 66, 24, .22);
}
.dx-auth-x {
  position: absolute; top: 10px; right: 14px; font-size: 22px; line-height: 1;
  color: #b08a3d; background: none; border: 0; cursor: pointer; padding: 4px;
}
.dx-auth-kicker {
  font-family: var(--serif); font-size: 22px; color: #7a5d28; font-weight: 500;
}
.dx-auth-sub {
  font-family: var(--sans); font-size: 13px; line-height: 1.6; color: #8a6c3c;
  margin: 10px 0 18px;
}
.dx-auth-tabs {
  display: flex; gap: 6px; justify-content: center; margin-bottom: 16px;
}
.dx-auth-tab {
  font-family: var(--sans); font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
  color: #a08a5e; background: none; border: 0; border-bottom: 1.5px solid transparent;
  padding: 6px 10px; cursor: pointer;
}
.dx-auth-tab.on { color: #7a5d28; border-bottom-color: #bf9a55; }
.dx-auth-form { display: flex; flex-direction: column; gap: 10px; }
.dx-auth-in {
  font-family: var(--sans); font-size: 14px; color: #55483a;
  background: #fffdf6; border: 1px solid rgba(163, 118, 47, .35); border-radius: 8px;
  padding: 11px 13px; outline: none;
}
.dx-auth-in:focus { border-color: #bf9a55; box-shadow: 0 0 0 3px rgba(191, 154, 85, .14); }
.dx-auth-go { margin-top: 4px; }
.dx-auth-err {
  font-family: var(--sans); font-size: 12.5px; color: #b0703d; margin-top: 12px; line-height: 1.5;
}
.dx-auth-or {
  font-family: var(--sans); font-size: 10px; letter-spacing: .3em; text-transform: uppercase;
  color: #b3a075; margin: 16px 0 10px;
}
.dx-auth-gslot { display: flex; justify-content: center; }

/* ============ the blocking wait ============
   Used only where the next thing genuinely cannot start yet — chapter entry
   and chapter-to-chapter transitions. Answering a question deliberately does
   NOT use this: that path acknowledges instantly and keeps the page live. */
.dx-busy {
  position: fixed; inset: 0; z-index: 90;
  display: flex; align-items: center; justify-content: center;
  background: rgba(247, 238, 219, .62);
  backdrop-filter: blur(2px) saturate(.85);
  opacity: 0; transition: opacity .38s ease;
  cursor: progress;
}
.dx-busy.in { opacity: 1; }
/* the message sits on its own ground so it reads against whatever is behind it —
   a faint line floating over greyed content is easy to miss entirely */
.dx-busy-inner {
  display: flex; align-items: center; gap: 13px;
  background: rgba(255, 251, 242, .92);
  border: 1px solid rgba(163, 118, 47, .28);
  border-radius: 999px; padding: 13px 22px;
  box-shadow: 0 10px 34px rgba(90, 66, 24, .13);
}
.dx-busy-pulse {
  width: 9px; height: 9px; border-radius: 50%;
  background: #c08a3c; box-shadow: 0 0 0 0 rgba(192, 138, 60, .45);
  animation: dxBusyPulse 1.8s ease-out infinite;
}
@keyframes dxBusyPulse {
  0%   { transform: scale(.85); box-shadow: 0 0 0 0 rgba(192,138,60,.45); }
  70%  { transform: scale(1);   box-shadow: 0 0 0 16px rgba(192,138,60,0); }
  100% { transform: scale(.85); box-shadow: 0 0 0 0 rgba(192,138,60,0); }
}
.dx-busy-text {
  font-family: var(--sans); font-size: 14.5px; font-weight: 500;
  letter-spacing: .03em; color: #6b4f1c; white-space: nowrap;
}
@media (max-width: 520px) { .dx-busy-text { white-space: normal; font-size: 13.5px; } }
/* everything behind the veil reads as unavailable, not merely covered */
body.dx-busy-on .dx-stage,
body.dx-busy-on .art-stage,
body.dx-busy-on .ch-nav,
body.dx-busy-on .scroll-hint { filter: grayscale(.55) opacity(.55); transition: filter .38s ease; }
body.dx-busy-on { cursor: progress; }
@media (prefers-reduced-motion: reduce) {
  .dx-busy { backdrop-filter: none; transition: none; }
  .dx-busy-pulse { animation: none; }
  body.dx-busy-on .dx-stage, body.dx-busy-on .art-stage { transition: none; }
}

/* ============ a week-sized plan ============ */
.ws-plan { width: min(660px, 92vw); margin: 4px auto 0; text-align: left; }
.ws-plan-do {
  font-family: var(--serif); font-size: clamp(17px, 2.4vh, 21px); line-height: 1.45;
  color: #6d5320; padding-bottom: 14px; border-bottom: 1px solid rgba(163,118,47,.2);
}
.ws-plan-row { display: flex; gap: 14px; padding: 9px 0; align-items: baseline; }
.ws-plan-k {
  flex: 0 0 128px; font-family: var(--sans); font-size: 9.5px; letter-spacing: .18em;
  text-transform: uppercase; color: #b08a3d; line-height: 1.5;
}
.ws-plan-v { font-family: var(--sans); font-size: 13px; line-height: 1.55; color: #6d5320; }

/* ============ the ranked long list ============ */
.ws-possibilities { width: min(760px, 94vw); margin: 30px auto 0; text-align: left; }
.ws-poss-head {
  font-family: var(--sans); font-size: 11px; letter-spacing: .3em; text-transform: uppercase;
  color: #a3762f; margin-bottom: 6px;
}
.ws-poss-note { font-family: var(--sans); font-size: 12px; color: #9d7f4d; margin-bottom: 14px; }
.ws-poss {
  display: flex; gap: 14px; align-items: flex-start;
  padding: 12px 0; border-bottom: 1px solid rgba(163,118,47,.14);
}
.ws-poss-n {
  flex: 0 0 22px; font-family: var(--sans); font-size: 11px; color: #b08a3d; padding-top: 2px;
}
.ws-poss-main { flex: 1 1 auto; min-width: 0; }
.ws-poss-name { font-family: var(--serif); font-size: 16px; color: #6d5320; }
.ws-poss-path {
  font-family: var(--sans); font-size: 12px; letter-spacing: .1em; text-transform: uppercase;
  color: #ab9668; margin-left: 6px;
}
.ws-poss-ai { font-family: var(--sans); font-size: 12px; line-height: 1.5; color: #8a6f42; margin-top: 3px; }
.ws-poss-have { font-family: var(--sans); font-size: 12.5px; line-height: 1.6; color: #a3762f; margin-top: 10px; }
.ws-poss-missing { font-family: var(--sans); font-size: 12.5px; color: #8d7f6c; margin-top: 4px; }
.ws-poss-bars { margin-top: 16px; display: flex; flex-direction: column; gap: 9px; max-width: 460px; }
.ws-bar-row { display: flex; align-items: center; gap: 12px; font-family: var(--sans); font-size: 12px; color: #8a6f42; }
.ws-bar-row em {
  font-style: normal; width: 122px; text-align: right;
  letter-spacing: .06em; color: #6e6557;
}
.ws-bar-row b { font-weight: 600; width: 42px; font-size: 13px; color: #55483a; }
.ws-bar {
  flex: 1; height: 9px; background: rgba(163, 118, 47, .12);
  border-radius: 5px; overflow: hidden;
  box-shadow: inset 0 1px 1px rgba(90, 70, 40, .08);
}
.ws-bar i {
  display: block; height: 100%; border-radius: 5px; background: #b98a3e;
  background-image: linear-gradient(to bottom, rgba(255,255,255,.22), rgba(255,255,255,0));
  transition: width 1s cubic-bezier(.3,.6,.3,1);
}
.ws-bar i.good { background-color: #7d9b62; }
.ws-bar i.risk { background-color: #c07a45; }
.ws-poss-cites { font-family: var(--sans); font-size: 11.5px; line-height: 1.7; color: #97876e; margin-top: 12px; }
.ws-poss-cites a { color: #a3762f; }

/* ---- opportunity radar ---- */
.dx-intel-profile { text-align: left; margin-bottom: 26px; }
.dx-intel-caps { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 8px; }
.dx-intel-cap {
  font-family: var(--sans); font-size: 12.5px; color: #7a5d28;
  background: rgba(191, 154, 85, .12); border: 1px solid rgba(163, 118, 47, .25);
  border-radius: 20px; padding: 6px 14px;
}
.dx-intel-ai { font-family: var(--sans); font-size: 13px; line-height: 1.7; color: #8a6f42; margin-top: 12px; }
/* path filters — each chip explains itself on hover */
.dx-intel-filters {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
  margin: 2px 0 20px; text-align: left;
}
.dx-intel-filter {
  position: relative; cursor: pointer;
  font-family: var(--sans); font-size: 11.5px; letter-spacing: .16em;
  text-transform: uppercase; color: #7a5d28;
  background: none; border: 1px solid rgba(163, 118, 47, .3);
  border-radius: 999px; padding: 8px 16px;
  transition: background .25s ease, color .25s ease, border-color .25s ease;
}
.dx-intel-filter i {
  font-style: normal; margin-left: 7px; font-size: 10px;
  color: #a08a5e; letter-spacing: 0;
}
.dx-intel-filter:hover { border-color: rgba(163, 118, 47, .55); }
.dx-intel-filter.active {
  background: #8d6a2b; border-color: #8d6a2b; color: #fdf8ec;
}
.dx-intel-filter.active i { color: rgba(253, 248, 236, .75); }
.dx-intel-filter.empty { opacity: .45; }
.dx-intel-tip {
  position: absolute; left: 0; top: calc(100% + 10px); z-index: 20;
  width: min(340px, 74vw); text-align: left; text-transform: none;
  letter-spacing: 0; padding: 14px 16px;
  background: #fdf8ec; border: 1px solid rgba(163, 118, 47, .3);
  border-radius: 12px; box-shadow: 0 10px 34px rgba(60, 44, 18, .18);
  opacity: 0; visibility: hidden; transform: translateY(-4px);
  transition: opacity .25s ease, transform .25s ease, visibility 0s linear .25s;
  pointer-events: none;
}
.dx-intel-filter:hover .dx-intel-tip, .dx-intel-filter:focus-visible .dx-intel-tip {
  opacity: 1; visibility: visible; transform: translateY(0);
  transition: opacity .25s ease, transform .25s ease;
}
.dx-intel-tip b {
  display: block; font-weight: 400; font-family: var(--sans);
  font-size: 12.5px; line-height: 1.6; color: #55524b;
}
.dx-intel-tip em {
  display: block; margin-top: 10px; padding-top: 10px;
  border-top: 1px solid rgba(163, 118, 47, .16);
  font-style: normal; font-family: var(--serif, Georgia, serif);
  font-size: 13.5px; line-height: 1.7; color: #7a5d28;
}

.dx-intel-list { display: flex; flex-direction: column; gap: 24px; text-align: left; }
.dx-intel-card {
  background: #fdf8ec; border: 1px solid rgba(163, 118, 47, .22); border-radius: 14px;
  padding: 26px 30px;
  box-shadow: 0 1px 0 rgba(163, 118, 47, .06);
}
.dx-intel-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.dx-intel-tags { display: flex; gap: 8px; flex-wrap: wrap; }
.dx-intel-type {
  font-family: var(--sans); font-size: 10px; letter-spacing: .24em; text-indent: .1em;
  padding: 5px 11px; border-radius: 5px; color: #7a5d28;
  background: rgba(191, 154, 85, .16);
}
.dx-intel-type-business { background: rgba(125, 155, 98, .18); color: #55663f; }
.dx-intel-type-skill { background: rgba(151, 134, 110, .16); color: #6e6557; }
.dx-intel-type-transition { background: rgba(192, 122, 69, .14); color: #8a5a2e; }
.dx-intel-title {
  font-family: var(--serif); font-size: clamp(23px, 3.2vh, 28px); line-height: 1.2;
  color: #55483a; font-weight: 500; margin-top: 10px;
}
.dx-intel-score { font-family: var(--serif); font-size: 32px; color: #8d6a2b; white-space: nowrap; }
.dx-intel-score i {
  font-style: normal; font-family: var(--sans); font-size: 10px;
  letter-spacing: .14em; text-transform: uppercase; color: #a08a5e; margin-left: 3px;
}
.dx-intel-why {
  font-family: var(--body-serif, serif); font-size: 15.5px; line-height: 1.7;
  color: #5d554a; margin-top: 10px;
}
.dx-intel-stats {
  display: flex; flex-wrap: wrap; gap: 10px 26px; margin-top: 16px;
  padding: 13px 16px; background: rgba(191, 154, 85, .07);
  border: 1px solid rgba(163, 118, 47, .14); border-radius: 10px;
}
.dx-intel-stat { display: flex; flex-direction: column; gap: 2px; }
.dx-intel-stat em {
  font-style: normal; font-family: var(--sans); font-size: 9.5px;
  letter-spacing: .18em; text-transform: uppercase; color: #a08a5e;
}
.dx-intel-stat b { font-family: var(--serif); font-size: 17px; font-weight: 500; color: #6d5320; }
.dx-intel-demand { font-family: var(--sans); font-size: 13px; line-height: 1.6; color: #7a5d28; margin-top: 12px; }
.dx-intel-exp { font-family: var(--sans); font-size: 13.5px; line-height: 1.7; color: #6e6557; margin-top: 12px; }
.dx-intel-exp b { color: #55483a; font-weight: 600; }
.dx-intel-state {
  display: inline-block;
  font-family: var(--sans); font-size: 10px; letter-spacing: .22em; text-transform: uppercase;
  color: #a08a5e; margin-top: 14px;
  border: 1px solid rgba(163, 118, 47, .25); border-radius: 999px; padding: 4px 12px;
}
.dx-intel-updated { font-family: var(--sans); font-size: 10.5px; color: #a89a7d; margin-top: 8px; }
.dx-intel-emerging { text-align: left; margin-top: 24px; }
.dx-intel-cluster { font-family: var(--sans); font-size: 13px; color: #6e6557; margin-top: 8px; }

/* ---- AI trajectory ---- */
.dx-traj-head { text-align: center; padding: 26px 0 20px; border-bottom: 1px solid rgba(163,118,47,.2); }
.dx-traj-kicker { font-family: var(--sans); font-size: 10px; letter-spacing: .34em; text-transform: uppercase; color: #a3762f; }
.dx-traj-verdict { font-family: var(--serif); font-size: clamp(34px, 5vh, 46px); font-weight: 500; margin-top: 10px; color: #7a5d28; }
.dx-traj-at_risk .dx-traj-verdict { color: #a35f2e; }
.dx-traj-insufficient_data .dx-traj-verdict { color: #8d7f6c; }
.dx-traj-read { font-family: var(--body-serif, serif); font-size: 15.5px; line-height: 1.7; color: #5d554a; max-width: 34em; margin: 14px auto 0; }
.dx-traj-conf { font-family: var(--sans); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: #a08a5e; margin-top: 12px; }
.dx-traj-score { text-align: left; margin-top: 26px; max-width: 460px; }
.dx-traj-score .ws-poss-head { display: flex; justify-content: space-between; align-items: baseline; }
.dx-traj-qa { text-align: left; margin-top: 26px; display: flex; flex-direction: column; gap: 16px; }
.dx-traj-a { font-family: var(--sans); font-size: 13px; line-height: 1.7; color: #5d554a; margin-top: 6px; }
.dx-traj-combos { text-align: left; margin-top: 26px; }
.dx-traj-combo { background: #fdf8ec; border: 1px solid rgba(163,118,47,.22); border-radius: 10px; padding: 14px 18px; margin-top: 10px; }
.dx-traj-combo-parts { font-family: var(--serif); font-size: 17px; color: #55483a; }
.dx-traj-combo-parts .plus { color: #bf9a55; padding: 0 10px; }
.dx-traj-combo-meta { font-family: var(--sans); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: #7d9b62; margin-top: 6px; }
.dx-traj-combo-why { font-family: var(--sans); font-size: 12px; line-height: 1.6; color: #6e6557; margin-top: 6px; }
.dx-traj-caps { text-align: left; margin-top: 26px; }
.dx-traj-cap { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: baseline; padding: 9px 2px; border-bottom: 1px solid rgba(163,118,47,.14); font-family: var(--sans); font-size: 12px; }
.dx-traj-cap-name { color: #55483a; font-weight: 600; min-width: 160px; }
.dx-traj-cap-sig { font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.dx-sig-structural_growth, .dx-sig-accelerating_growth, .dx-sig-emerging { color: #55663f; }
.dx-sig-stable { color: #8a6f42; }
.dx-sig-declining { color: #a35f2e; }
.dx-sig-insufficient_data { color: #a89a7d; }
.dx-traj-cap-growth { color: #6e6557; }
.dx-traj-cap-lev { color: #a08a5e; font-size: 11px; }
.dx-traj-gaps { text-align: left; margin-top: 26px; }
.dx-traj-imp { font-size: 9.5px; letter-spacing: .16em; text-transform: uppercase; color: #a3762f; margin-left: 8px; }
.ws-poss-meta { flex: 0 0 132px; display: flex; flex-direction: column; gap: 4px; align-items: flex-end; }
.ws-poss-fit, .ws-poss-demand, .ws-poss-lic {
  font-family: var(--sans); font-size: 12px; letter-spacing: .06em; text-align: right;
}
.ws-poss-fit { color: #6d5320; }
.ws-poss-demand.known { color: #7a8f4a; }
/* an unknown must not read like a quiet negative — it reads as absent */
.ws-poss-demand.open { color: #b5a487; font-style: italic; }
.ws-poss-lic { color: #b08a3d; }
.ws-poss-honesty {
  font-family: var(--sans); font-size: 11.5px; line-height: 1.55; color: #9d7f4d;
  margin-top: 14px; font-style: italic;
}
@media (max-width: 700px) {
  .ws-poss { flex-wrap: wrap; }
  .ws-poss-meta { flex: 1 1 100%; flex-direction: row; justify-content: flex-start; gap: 12px; }
  .ws-plan-row { flex-direction: column; gap: 2px; }
  .ws-plan-k { flex: none; }
}
.ws-list-title {
  font-family: var(--serif); font-size: clamp(17px, 2.3vh, 21px); color: #6d5320;
  margin-bottom: 12px; padding-bottom: 10px;
  border-bottom: 1px solid rgba(163, 118, 47, .2);
}

.ws-action.loading { opacity: .6; cursor: progress; }
.ws-action-failed {
  font-family: var(--sans); font-size: 12px; color: #b0703d;
  margin: 6px 0 2px; text-align: center;
}

/* ---- UNBIFY Edge + artifact feedback ---- */
.dx-edge {
  max-width: 680px; margin: 6px auto 0; text-align: left;
  display: flex; flex-direction: column; gap: 16px;
}
.dx-edge-head { text-align: center; padding: 4px 0 14px; border-bottom: 1px solid rgba(163,118,47,.2); }
.dx-edge-name {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(32px, 4.6vh, 44px); line-height: 1.12;
  letter-spacing: -0.01em; color: #7a5d28;
}
.dx-edge-sec {
  background: #fdf8ec; border: 1px solid rgba(163,118,47,.22);
  border-radius: 12px; padding: 20px 24px;
}
.dx-edge-k {
  font-family: var(--sans); font-size: 11px; letter-spacing: .3em;
  text-transform: uppercase; color: #a3762f; margin-bottom: 10px;
}
.dx-edge-t {
  font-family: var(--body-serif, serif); font-size: 16.5px; line-height: 1.75;
  color: #5d554a;
}
.dx-edge-note {
  font-family: var(--sans); font-size: 12px; line-height: 1.6;
  color: #9d7f4d; margin-top: 10px;
}
.dx-edge-combo {
  font-family: var(--serif); font-size: clamp(19px, 2.7vh, 24px);
  color: #55483a; margin-bottom: 8px;
}
.dx-edge-combo .plus { color: #bf9a55; padding: 0 12px; }
.dx-edge-market { display: flex; flex-direction: column; }
.dx-edge-mrow {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 14px; flex-wrap: wrap; padding: 11px 2px;
  border-bottom: 1px solid rgba(163,118,47,.14);
}
.dx-edge-mrow:last-child { border-bottom: none; padding-bottom: 2px; }
.dx-edge-mtitle { font-family: var(--serif); font-size: 17px; color: #55483a; }
.dx-edge-demand {
  font-family: var(--sans); font-size: 10.5px; letter-spacing: .12em;
  text-transform: uppercase; color: #8d7f6c;
  background: rgba(151, 134, 110, .12); border-radius: 999px; padding: 4px 12px;
}
.dx-edge-demand.d-growing { color: #55663f; background: rgba(125, 155, 98, .18); }
.dx-edge-cites {
  font-family: var(--sans); font-size: 11px; line-height: 1.7;
  color: #97876e; padding: 0 4px;
}
.dx-edge-foot {
  text-align: center; padding-top: 18px;
  border-top: 1px solid rgba(163,118,47,.2);
}
.dx-edge-foot .dx-feedback { justify-content: center; margin-bottom: 14px; }
.dx-edge-share-note { font-family: var(--sans); font-size: 11.5px; color: #9d7f4d; margin-top: 8px; }
.dx-edge-card {
  font-family: var(--sans); font-size: 13px; color: #55663f;
  border: 1px dashed rgba(125, 155, 98, .5); border-radius: 10px;
  padding: 10px 12px; margin-top: 10px; display: inline-block;
}
@media (max-width: 640px) {
  .dx-edge-sec { padding: 16px 16px; }
  .dx-edge-mrow { flex-direction: column; gap: 4px; align-items: flex-start; }
}
.dx-feedback { margin: 12px 0 4px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.dx-feedback-q { font-family: var(--sans); font-size: 13.5px; color: #6e6557; margin-right: 4px; }
.dx-feedback-btn {
  font-family: var(--sans); font-size: 13px; color: #55524b;
  background: rgba(151, 134, 110, .1); border: 1px solid rgba(151, 134, 110, .28);
  border-radius: 999px; padding: 6px 15px; cursor: pointer;
  transition: background .25s ease;
}
.dx-feedback-btn:hover { background: rgba(151, 134, 110, .2); }
.dx-path-evolution { background: rgba(110, 139, 168, .16); color: #46617e; }
.dx-path-leverage { background: rgba(125, 155, 98, .18); color: #55663f; }
.dx-path-adventure { background: rgba(192, 122, 69, .16); color: #8a5a2e; }
.dx-path-entrepreneurial { background: rgba(151, 110, 160, .14); color: #6d4f74; }
.dx-path-curiosity { background: rgba(151, 134, 110, .16); color: #6e6557; }

/* ---- The space filling while the person is already inside it ----
   Calm and persistent, never a spinner and never a percentage: the only
   claim it makes is that work is happening, which is true for exactly as
   long as it is shown. */
.ws-snap-shaping {
  font-family: var(--sans); font-size: 12.5px; color: #9a8b70;
  margin-top: 6px; line-height: 1.5;
}
.ws-snap-shaping em {
  font-family: var(--serif); font-style: normal; font-size: 13.5px;
  color: #8d6a2b; letter-spacing: .02em; display: block;
}
.ws-snap-shaping span { opacity: .82; }

/* A module that just finished building settles in where its waiting row was
   — one quiet beat, not a re-entrance. */
@keyframes wsArrived {
  from { opacity: .45; border-color: rgba(216,150,80,.55); }
  to   { opacity: 1; }
}
.ws-action-arrived { animation: wsArrived .9s ease both !important; }
@media (prefers-reduced-motion: reduce) {
  .ws-action-arrived { animation: none !important; }
}

/* ---- A module that hasn't earned its place yet ----
   It stays on the page. It reads at the same weight as the rest — same row,
   same type — only quieter, with a chip saying what it is waiting on. It is
   not a disabled control to fight with: nothing behind it yet, so nothing to
   open. */
.ws-action-waiting,
.ws-action-waiting:hover {
  opacity: .62;
  cursor: default;
  pointer-events: none;
  transform: none;
  box-shadow: none;
  border-style: dashed;
  border-color: rgba(201, 167, 110, .3);
  background: rgba(253, 249, 240, .28);
}
.ws-wait-chip {
  font-family: var(--sans); font-size: 10.5px; letter-spacing: .07em;
  text-transform: uppercase; color: #94886f;
  border: 1px solid rgba(151, 134, 110, .3); border-radius: 999px;
  padding: 3px 10px; white-space: nowrap; align-self: center; flex: 0 0 auto;
}
@media (max-width: 640px) {
  .ws-wait-chip { align-self: flex-start; }
}

/* ---- Coming-soon tiles: visible ambition, honest state ---- */
.ws-action-soon,
.ws-action-soon:hover {
  opacity: 0.5;
  cursor: default;
  pointer-events: none;
  filter: saturate(0.4);
}
.ws-soon-chip {
  font-family: var(--sans); font-size: 11px; letter-spacing: 0.06em;
  text-transform: uppercase; color: #8a8574;
  border: 1px solid rgba(151, 134, 110, .35); border-radius: 999px;
  padding: 3px 10px; white-space: nowrap; align-self: center;
}

/* ---- What AI unlocks for you: grounded in the Professional Audit ----
   Editorial, not a dashboard: one reading column, hairline rules between
   sections, a thin line carrying each opportunity from what you have to
   what it unlocks. Type sizes follow the section spec (heading 32–42px,
   opportunity titles 24–30px, body 16–18px, source metadata 13–14px). */
@keyframes alfNodeIn { to { opacity: 1; transform: translateY(0); } }

.ws-alf2 { text-align: left; }
.ws-alf2 .ws-detail-head {
  font-size: clamp(32px, 4.2vw, 42px); line-height: 1.12; color: #6d5320;
  text-align: left; margin-bottom: 12px;
}
.ws-alf2-summary { max-width: 38em; font-family: var(--serif); font-size: clamp(18px, 1.9vw, 21px); line-height: 1.5; color: #4c443b; }
.ws-alf2-basis { margin-top: 10px; font-family: var(--sans); font-size: 13px; letter-spacing: .05em; color: #8a7a5e; }
.ws-alf2-sec { margin-top: 44px; padding-top: 26px; border-top: 1px solid rgba(163, 118, 47, .22); }
.ws-alf2-eyebrow { font-family: var(--sans); font-weight: 500; font-size: 12.5px; letter-spacing: .26em; text-transform: uppercase; color: #a3762f; }
.ws-alf2-lead { margin-top: 8px; max-width: 42em; font-family: var(--sans); font-size: 15px; line-height: 1.6; color: #7d7268; }
.ws-alf2-k { font-family: var(--sans); font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: #a3762f; }
.ws-alf2-note { margin-top: 8px; font-family: var(--sans); font-size: 14px; line-height: 1.5; color: #a0582a; }
.ws-alf2-note.is-doing { color: #55663f; }
.ws-alf2-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* sources: quiet labels with a coloured mark, never pills */
.ws-alf2-srcs { display: inline-flex; flex-wrap: wrap; gap: 2px 12px; margin-right: 12px; vertical-align: middle; }
.ws-alf2-src { position: relative; padding-left: 11px; font-family: var(--sans); font-size: 13px; letter-spacing: .08em;
  text-transform: uppercase; color: #8a7a5e; white-space: nowrap; }
.ws-alf2-src::before { content: ""; position: absolute; left: 0; top: 50%; width: 6px; height: 6px; margin-top: -3px;
  border-radius: 50%; background: var(--alf-mark, #a2957c); }
.ws-alf2-src[data-src="RESUME"] { --alf-mark: #a67a34; }
.ws-alf2-src[data-src="LINKEDIN"] { --alf-mark: #50708f; }
.ws-alf2-src[data-src="PORTFOLIO"] { --alf-mark: #c2672c; }
.ws-alf2-src[data-src="GITHUB"] { --alf-mark: #5d5a50; }
.ws-alf2-ev { display: inline-flex; align-items: center; min-height: 32px; padding: 0; background: none; border: 0; cursor: pointer;
  font-family: var(--sans); font-size: 13.5px; color: #8d6a38; text-decoration: underline; text-decoration-color: rgba(141,106,56,.35);
  text-underline-offset: 4px; vertical-align: middle; }
.ws-alf2-ev:hover { color: #6d5320; text-decoration-color: currentColor; }
.ws-alf2-ev:focus-visible, .ws-alf2-try-btn:focus-visible, .ws-alf2-fb-btn:focus-visible,
.ws-alf2-cta:focus-visible, .ws-alf2-route-go:focus-visible, .ws-alf2-why summary:focus-visible {
  outline: 2px solid var(--orange); outline-offset: 3px; border-radius: 3px; }

.ws-alf2-strength { display: inline-flex; align-items: center; gap: 7px; font-family: var(--sans); font-size: 13px; font-weight: 500;
  letter-spacing: .12em; text-transform: uppercase; color: #8a7a5e; }
.ws-alf2-strength::before { content: ""; width: 7px; height: 7px; border-radius: 50%; border: 1.5px solid #c9a76e; }
.ws-alf2-strength[data-strength="strong"] { color: #7a5a22; }
.ws-alf2-strength[data-strength="strong"]::before { background: var(--orange); border-color: var(--orange); }

/* your strongest capabilities */
.ws-alf2-caps { list-style: none; margin: 14px 0 0; padding: 0; }
.ws-alf2-cap { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 24px; align-items: baseline;
  padding: 16px 0; border-bottom: 1px solid rgba(163, 118, 47, .14); }
.ws-alf2-cap-name { font-family: var(--serif); font-weight: 500; font-size: clamp(22px, 2.3vw, 26px); line-height: 1.2; color: #3f3830; }
.ws-alf2-cap-meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; justify-self: end; text-align: right; }
.ws-alf2-cap-level { font-family: var(--body-serif); font-style: italic; font-size: 16px; color: #7d7268; }
.ws-alf2-cap-src { grid-column: 1 / -1; }
.ws-alf2-cap .ws-alf2-note { grid-column: 1 / -1; }

/* where you are today */
.ws-alf2-position { margin-top: 12px; max-width: 36em; font-family: var(--serif); font-size: clamp(20px, 2.1vw, 23px); line-height: 1.45; color: #4c443b; }
.ws-alf2-where { margin-top: 8px; font-family: var(--sans); font-size: 14px; line-height: 1.6; color: #7d7268; }
.ws-alf2-where > .ws-alf2-srcs:first-child { margin-left: 0; }
.ws-alf2-opp-title .ws-alf2-where .ws-alf2-srcs { margin-left: 12px; }

/* the opportunities: numbered, vertical, one thread per opportunity */
.ws-alf2-opps { list-style: none; margin: 8px 0 0; padding: 0; }
.ws-alf2-opp { padding: 34px 0 30px; border-bottom: 1px solid rgba(163, 118, 47, .18); transition: opacity .3s ease; }
.ws-alf2-opp:last-child { border-bottom: 0; }
.ws-alf2-opp.dimmed { opacity: .55; }
@media (prefers-reduced-motion: no-preference) {
  .ws-alf2-opp { opacity: 0; transform: translateY(10px);
    animation: alfNodeIn .7s cubic-bezier(.3,.6,.3,1) forwards; animation-delay: calc(var(--i, 0) * 90ms); }
  .ws-alf2-opp.dimmed { animation: none; opacity: .55; transform: none; }
}
.ws-alf2-opp-head { display: grid; grid-template-columns: 72px minmax(0, 1fr); align-items: start; }
/* lining figures: Cormorant's old-style "01" reads as the letters "OI" */
.ws-alf2-num { font-family: var(--serif); font-weight: 500; font-size: 46px; line-height: .9; color: #cfae78;
  font-variant-numeric: lining-nums tabular-nums; }
.ws-alf2-title { margin-top: 4px; font-family: var(--serif); font-weight: 500; font-size: clamp(24px, 2.7vw, 30px); line-height: 1.22; color: #3f3830; }
.ws-alf2-chain { position: relative; list-style: none; margin: 26px 0 0 72px; padding: 0 0 0 28px; }
.ws-alf2-chain::before { content: ""; position: absolute; left: 5px; top: 9px; bottom: 12px; width: 1px;
  background: linear-gradient(to bottom, #c9a76e, #c9a76e 60%, rgba(232,118,60,.8)); }
.ws-alf2-step { position: relative; padding-bottom: 18px; }
.ws-alf2-step:last-child { padding-bottom: 0; }
.ws-alf2-step::before { content: ""; position: absolute; left: -28px; top: 5px; width: 11px; height: 11px; border-radius: 50%;
  background: #faf3e6; border: 2px solid #c9a76e; box-sizing: border-box; }
.ws-alf2-step.is-ai::before { border-color: var(--orange); }
.ws-alf2-step.is-keep::before { border-color: #8d6a38; background: #8d6a38; }
.ws-alf2-step.is-unlock::before { border-color: var(--orange); background: var(--orange); }
.ws-alf2-step-k { font-family: var(--sans); font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: #a3762f; }
.ws-alf2-step.is-ai .ws-alf2-step-k, .ws-alf2-step.is-unlock .ws-alf2-step-k { color: #b85f2a; }
.ws-alf2-step-main { margin-top: 4px; max-width: 36em; font-family: var(--body-serif); font-size: clamp(16.5px, 1.6vw, 18px); line-height: 1.55; color: #3f3830; }
.ws-alf2-step.is-have .ws-alf2-step-main { font-family: var(--serif); font-size: clamp(19px, 2vw, 21px); }
.ws-alf2-step-sub { margin-top: 4px; font-family: var(--sans); font-size: 14px; line-height: 1.6; color: #7d7268; }
.ws-alf2-traj { color: #b85f2a; }

.ws-alf2-try, .ws-alf2-why, .ws-alf2-fb { margin-left: 72px; }
.ws-alf2-try { margin-top: 20px; }
.ws-alf2-try-btn { padding: 8px 0; background: none; border: 0; cursor: pointer; font-family: var(--sans); font-weight: 500;
  font-size: 14px; letter-spacing: .16em; text-transform: uppercase; color: #b85f2a; }
.ws-alf2-try-btn:hover { color: #8d4a1f; }
.ws-alf2-try-text { margin-top: 6px; max-width: 38em; padding: 4px 0 4px 16px; border-left: 2px solid var(--orange);
  font-family: var(--body-serif); font-size: 17px; line-height: 1.6; color: #3f3830; }
.ws-alf2-why { margin-top: 12px; font-family: var(--sans); font-size: 14px; color: #7d7268; }
.ws-alf2-why summary { cursor: pointer; min-height: 32px; display: inline-flex; align-items: center; color: #8a7a5e; }
.ws-alf2-why ul { margin: 6px 0 0 18px; padding: 0; line-height: 1.6; }
.ws-alf2-fb { margin-top: 14px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; }
.ws-alf2-fb-q { font-family: var(--sans); font-size: 14px; color: #7d7268; }
.ws-alf2-fb-opts { display: flex; flex-wrap: wrap; gap: 2px 14px; }
.ws-alf2-fb-btn { min-height: 36px; padding: 0; background: none; border: 0; cursor: pointer; font-family: var(--sans);
  font-size: 14px; color: #55483a; text-decoration: underline; text-decoration-color: rgba(85,72,58,.25); text-underline-offset: 5px; }
.ws-alf2-fb-btn:hover { text-decoration-color: currentColor; }
.ws-alf2-fb-btn[aria-pressed="true"] { color: #b85f2a; font-weight: 500; text-decoration-color: var(--orange); text-decoration-thickness: 2px; }
.ws-alf2-fb-note { flex-basis: 100%; min-height: 1.4em; font-family: var(--sans); font-size: 14px; color: #55663f; }
.ws-alf2-fb-note.err { color: #a0582a; }

.ws-alf2-routes { margin-top: 30px; padding-top: 20px; border-top: 1px solid rgba(163, 118, 47, .14); }
.ws-alf2-route { font-family: var(--sans); font-size: 15px; line-height: 1.6; color: #6e6557; }
.ws-alf2-route-go { margin-left: 6px; min-height: 36px; padding: 0; background: none; border: 0; cursor: pointer;
  font-family: var(--sans); font-weight: 500; font-size: 14px; color: #b85f2a; }

/* before an audit exists: an honest invitation, not generic tips */
.ws-alf2-invite-line { margin-top: 12px; max-width: 34em; font-family: var(--serif); font-size: clamp(20px, 2.2vw, 24px); line-height: 1.45; color: #4c443b; }
.ws-alf2-cta { margin-top: 22px; min-height: 48px; padding: 12px 26px; cursor: pointer; border-radius: 40px;
  border: 1px solid rgba(201,167,110,.75); background: linear-gradient(180deg, #fffaf0, #fbefd8);
  font-family: var(--sans); font-weight: 500; font-size: 14px; letter-spacing: .16em; text-transform: uppercase; color: #7a5a22; }
.ws-alf2-cta:hover { border-color: rgba(216,150,80,.9); }

/* the evidence drawer's items */
.ws-alf2-ev-item { padding: 14px 0; border-top: 1px solid rgba(163, 118, 47, .15); }
.ws-alf2-ev-src { display: flex; flex-wrap: wrap; gap: 4px 12px; font-family: var(--sans); font-size: 13px; color: #8a7a5e; }
.ws-alf2-ev-item blockquote { margin: 8px 0 0; padding-left: 14px; border-left: 2px solid #c9a76e;
  font-family: var(--body-serif); font-size: 17px; line-height: 1.55; color: #3f3830; }
.ws-alf2-ev-why { margin-top: 6px; font-family: var(--sans); font-size: 13px; line-height: 1.5; color: #8a7a5e; }
.ws-alf2-ev-why a { color: #46617e; }

@media (max-width: 640px) {
  .ws-alf2-cap { grid-template-columns: 1fr; }
  .ws-alf2-cap-meta { justify-self: start; text-align: left; }
  .ws-alf2-opp-head { grid-template-columns: 1fr; }
  .ws-alf2-num { font-size: 34px; margin-bottom: 4px; }
  .ws-alf2-chain { margin-left: 0; }
  .ws-alf2-try, .ws-alf2-why, .ws-alf2-fb { margin-left: 0; }
}

/* ---- My AI Trajectory: the AI Trajectory Engine ----
   Architectural rather than editorial: cool ink, hairline rules, one thread
   through four states, large state titles and generous space. No pills and no
   cards inside cards — the timeline itself is the visual identity. */
.ws-tr-wrap .ws-detail-head {
  font-size: clamp(42px, 5vw, 52px); line-height: 1.08; letter-spacing: -.01em; color: #2f3437;
}
.ws-tr {
  --tr-ink: #2f3437; --tr-soft: #545b60; --tr-mute: #767d82; --tr-rule: rgba(47, 52, 55, .16);
  --tr-line: #8e979c; --tr-cool: #3f5a74; --tr-paper: #f7f3ea;
  max-width: 1040px; margin: 0 auto; text-align: left; color: var(--tr-ink);
}
.ws-tr .dx-support { max-width: 40em; }
.ws-tr-h {
  margin: 0 0 8px; font-family: var(--sans); font-size: 13px; font-weight: 600;
  letter-spacing: .22em; text-transform: uppercase; color: var(--tr-mute);
}
.ws-tr-p { font-family: var(--sans); font-size: 16px; line-height: 1.6; color: var(--tr-ink); }
.ws-tr-meta { margin-top: 6px; font-family: var(--sans); font-size: 14px; color: var(--tr-soft); }
.ws-tr-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.ws-tr :focus-visible { outline: 2px solid var(--tr-cool); outline-offset: 3px; border-radius: 2px; }

.ws-tr-today {
  margin-top: 34px; padding: 26px 0 28px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px 56px;
  border-top: 1px solid var(--tr-ink); border-bottom: 1px solid var(--tr-rule);
}
.ws-tr-today-title {
  font-family: var(--serif, Georgia, serif); font-weight: 500;
  font-size: clamp(30px, 3.4vw, 38px); line-height: 1.15; color: var(--tr-ink);
}
.ws-tr-facts { margin: 16px 0 0; display: grid; gap: 12px; }
.ws-tr-facts div, .ws-tr-compact div, .ws-tr-unlock div, .ws-tr-metrics div { min-width: 0; }
.ws-tr-facts div, .ws-tr-compact div { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 16px; }
.ws-tr-facts dt, .ws-tr-compact dt { padding-top: 2px; font-family: var(--sans); font-size: 13.5px; color: var(--tr-mute); }
.ws-tr-facts dd, .ws-tr-compact dd { margin: 0; font-family: var(--sans); font-size: 16px; line-height: 1.5; color: var(--tr-ink); }
.ws-tr-disputes { margin-top: 18px; padding-left: 16px; border-left: 2px solid rgba(138, 74, 42, .55); }
.ws-tr-disputes ul { margin: 0; padding-left: 18px; font-family: var(--sans); font-size: 15.5px; line-height: 1.6; color: #6b4a2a; }
@media (min-width: 900px) {
  .ws-tr-today { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); }
  .ws-tr-today > .ws-tr-h, .ws-tr-today > .ws-tr-today-title, .ws-tr-today > .ws-tr-meta { grid-column: 1; }
  .ws-tr-today > .ws-tr-facts { grid-column: 2; grid-row: 1 / span 3; margin-top: 0; }
  .ws-tr-today > .ws-tr-disputes { grid-column: 1 / -1; }
}

/* the path selector: text tabs on a rule */
.ws-tr-tabs {
  margin-top: 40px; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 0 24px; border-bottom: 1px solid var(--tr-rule);
}
.ws-tr-tab {
  display: grid; gap: 4px; padding: 14px 0 16px; margin-bottom: -1px; text-align: left; cursor: pointer;
  background: none; border: 0; border-bottom: 2px solid transparent; color: var(--tr-soft);
}
.ws-tr-tab:hover { color: var(--tr-ink); }
.ws-tr-tab[aria-selected="true"] { color: var(--tr-ink); border-bottom-color: var(--tr-ink); }
.ws-tr-tab-k { font-family: var(--sans); font-size: 12.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--tr-mute); }
.ws-tr-tab-t { font-family: var(--serif, Georgia, serif); font-size: 22px; line-height: 1.25; }
.ws-tr-tab-m { font-family: var(--sans); font-size: 13.5px; color: var(--tr-mute); }

.ws-tr-panel { padding-top: 28px; }
.ws-tr-target { font-family: var(--serif, Georgia, serif); font-size: clamp(22px, 2.4vw, 27px); line-height: 1.3; color: var(--tr-soft); }
.ws-tr-target strong { font-weight: 500; color: var(--tr-ink); }
.ws-tr-metrics {
  margin: 20px 0 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  border-top: 1px solid var(--tr-rule); border-bottom: 1px solid var(--tr-rule);
}
.ws-tr-metrics div { padding: 14px 16px 16px 0; }
.ws-tr-metrics dt { font-family: var(--sans); font-size: 13.5px; color: var(--tr-mute); }
.ws-tr-metrics dd { margin: 4px 0 0; font-family: var(--serif, Georgia, serif); font-size: 23px; color: var(--tr-ink); }

/* the timeline: a rail of horizons, one thread, a direction marker between states */
.ws-tr-line { list-style: none; margin: 34px 0 0; padding: 0; }
.ws-tr-step, .ws-tr-link { display: grid; grid-template-columns: 118px minmax(0, 1fr); gap: 0 30px; }
.ws-tr-rail { position: relative; min-height: 20px; }
.ws-tr-rail::before { content: ""; position: absolute; left: 7px; top: 0; bottom: 0; width: 1px; background: var(--tr-line); }
.ws-tr-step:first-child .ws-tr-rail::before { top: 12px; }
.ws-tr-step:last-child .ws-tr-rail::before { bottom: auto; height: 12px; }
.ws-tr-dot {
  position: absolute; left: 1px; top: 6px; width: 13px; height: 13px; border-radius: 50%;
  background: var(--tr-paper); border: 1.5px solid var(--tr-ink);
}
.ws-tr-step.is-now .ws-tr-dot { background: var(--tr-ink); }
.ws-tr-horizon {
  display: block; padding-left: 28px; font-family: var(--sans); font-size: 13px; font-weight: 600;
  letter-spacing: .24em; line-height: 1.9; color: var(--tr-mute);
}
.ws-tr-horizon-inline { display: none; }
.ws-tr-arrow {
  position: absolute; left: 3px; top: 30px; width: 9px; height: 9px;
  border-right: 1.5px solid var(--tr-ink); border-bottom: 1.5px solid var(--tr-ink);
  transform: rotate(45deg); background: var(--tr-paper);
}
.ws-tr-body { min-width: 0; padding-bottom: 6px; }
.ws-tr-state {
  margin: 0; font-family: var(--serif, Georgia, serif); font-weight: 500;
  font-size: clamp(26px, 3vw, 34px); line-height: 1.18; color: var(--tr-ink);
}
.ws-tr-changes { margin-top: 10px; max-width: 42em; font-family: var(--sans); font-size: 17px; line-height: 1.6; color: var(--tr-soft); }
.ws-tr-compact { margin: 16px 0 0; display: grid; gap: 8px; max-width: 46em; }
.ws-tr-compact div { grid-template-columns: 124px minmax(0, 1fr); }
.ws-tr-node-meta { margin-top: 12px; font-family: var(--sans); font-size: 13.5px; color: var(--tr-mute); }
.ws-tr-link .ws-tr-body { padding: 24px 0 34px; }
.ws-tr-link .ws-tr-body > * { max-width: 46em; }
.ws-tr-chain { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; font-family: var(--sans); font-size: 14.5px; color: var(--tr-cool); }
.ws-tr-chain-sep { color: var(--tr-line); }
.ws-tr-because { margin-top: 6px; font-family: var(--serif, Georgia, serif); font-style: italic; font-size: 17px; line-height: 1.55; color: var(--tr-soft); }
.ws-tr-unlock { margin: 14px 0 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px 28px; }
.ws-tr-unlock dt { font-family: var(--sans); font-size: 12.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--tr-mute); }
.ws-tr-unlock dd { margin: 4px 0 0; font-family: var(--sans); font-size: 16px; line-height: 1.5; color: var(--tr-ink); }
@media (prefers-reduced-motion: no-preference) {
  .ws-tr-step, .ws-tr-link { animation: trSettle .55s cubic-bezier(.3,.6,.3,1) both; }
}
@keyframes trSettle { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.ws-tr-inspect { margin-top: 12px; padding-top: 16px; display: flex; flex-wrap: wrap; gap: 6px 30px; border-top: 1px solid var(--tr-rule); }
.ws-tr-toggle {
  min-height: 40px; padding: 8px 0; background: none; border: 0; border-bottom: 1px solid transparent;
  font-family: var(--sans); font-size: 15.5px; color: var(--tr-cool); cursor: pointer;
}
.ws-tr-toggle:hover, .ws-tr-toggle[aria-expanded="true"] { border-bottom-color: currentColor; }
.ws-tr-detail { margin-top: 20px; display: grid; gap: 24px; max-width: 54em; }
.ws-tr-list { margin: 0; padding-left: 18px; font-family: var(--sans); font-size: 16px; line-height: 1.65; color: var(--tr-ink); }
.ws-tr-caps, .ws-tr-claims { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.ws-tr-caps li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 18px; padding-bottom: 10px; border-bottom: 1px solid var(--tr-rule); }
.ws-tr-cap { font-family: var(--sans); font-size: 16px; color: var(--tr-ink); }
.ws-tr-standing { font-family: var(--sans); font-size: 14px; text-align: right; color: var(--tr-mute); }
.ws-tr-standing.s-demonstrated { color: #4a6340; }
.ws-tr-standing.s-partial { color: var(--tr-cool); }
.ws-tr-standing.s-missing { color: #8a4a2a; }
.ws-tr-cap-basis { grid-column: 1 / -1; font-family: var(--sans); font-size: 14px; line-height: 1.5; color: var(--tr-mute); }
.ws-tr-claims li { display: grid; gap: 3px; padding-bottom: 10px; border-bottom: 1px solid var(--tr-rule); }
.ws-tr-src { font-family: var(--sans); font-size: 13.5px; line-height: 1.5; color: var(--tr-mute); }
.ws-tr-src a { color: var(--tr-cool); }

.ws-tr-fb { margin-top: 30px; }
.ws-tr-fb-q { font-family: var(--serif, Georgia, serif); font-size: 20px; color: var(--tr-ink); }
.ws-tr-opts { margin-top: 10px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ws-tr-btn {
  min-height: 40px; padding: 8px 16px; background: none; border: 1px solid rgba(47, 52, 55, .3); border-radius: 3px;
  font-family: var(--sans); font-size: 15px; color: var(--tr-ink); cursor: pointer;
}
.ws-tr-btn:hover { border-color: var(--tr-ink); }
.ws-tr-btn[aria-pressed="true"] { background: var(--tr-ink); border-color: var(--tr-ink); color: var(--tr-paper); }
.ws-tr-btn:disabled { opacity: .5; cursor: default; }
.ws-tr-note { min-height: 1.5em; margin-top: 8px; font-family: var(--sans); font-size: 15px; line-height: 1.5; color: #4a6340; }
.ws-tr-note.err { color: #8a4a2a; }
.ws-tr-notice {
  margin-top: 24px; padding: 14px 18px; border-left: 2px solid #4a6340; background: rgba(74, 99, 64, .06);
  font-family: var(--sans); font-size: 16px; line-height: 1.55; color: var(--tr-ink);
}

.ws-tr-logic { margin-top: 48px; padding: 30px 0 32px; border-top: 1px solid var(--tr-ink); border-bottom: 1px solid var(--tr-rule); }
.ws-tr-logic-text { max-width: 40em; font-family: var(--serif, Georgia, serif); font-size: clamp(22px, 2.3vw, 27px); line-height: 1.5; color: var(--tr-ink); }
.ws-tr-move { margin-top: 38px; }
.ws-tr-move-for { font-family: var(--sans); font-size: 15px; color: var(--tr-mute); }
.ws-tr-actions { list-style: none; counter-reset: tr; margin: 20px 0 0; padding: 0; display: grid; gap: 26px; }
.ws-tr-actions > li { counter-increment: tr; display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: 12px; }
.ws-tr-actions > li::before {
  content: counter(tr, decimal-leading-zero); grid-row: 1 / span 4; padding-top: 7px;
  font-family: var(--sans); font-size: 13.5px; letter-spacing: .12em; color: var(--tr-mute);
}
.ws-tr-actions > li > * { grid-column: 2; }
.ws-tr-action { max-width: 36em; font-family: var(--serif, Georgia, serif); font-size: 22px; line-height: 1.42; color: var(--tr-ink); }
.ws-tr-action-why { margin-top: 4px; font-family: var(--sans); font-size: 14.5px; color: var(--tr-mute); }
.ws-tr-outcome-q { font-family: var(--sans); font-size: 14px; color: var(--tr-mute); margin-right: 4px; }

@media (max-width: 720px) {
  .ws-tr-step, .ws-tr-link { grid-template-columns: 16px minmax(0, 1fr); gap: 0 16px; }
  .ws-tr-horizon { display: none; }
  .ws-tr-horizon-inline {
    display: block; margin-bottom: 4px; font-family: var(--sans); font-size: 13px; font-weight: 600;
    letter-spacing: .24em; color: var(--tr-mute);
  }
  .ws-tr-facts div, .ws-tr-compact div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .ws-tr-tabs { grid-template-columns: minmax(0, 1fr); }
  .ws-tr-caps li { grid-template-columns: minmax(0, 1fr); }
  .ws-tr-standing { text-align: left; }
  .ws-tr-actions > li { grid-template-columns: minmax(0, 1fr); }
  .ws-tr-actions > li::before { grid-row: auto; padding-top: 0; }
  .ws-tr-actions > li > * { grid-column: 1; }
}

/* ---- Field Intelligence: an evidence-first intelligence feed ----
   Hierarchy comes from type and spacing, not containers: one quiet card, a
   serif finding, one prominent action, secondary text actions, and a quiet
   feedback row. No pills. */
.ws-fi-wrap .ws-detail-head { font-size: clamp(32px, 4.4vw, 40px); line-height: 1.15; }
.ws-fi-meta { font-family: var(--sans); font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: #8f7a52; margin: 6px 0 16px; }
.ws-fi-insufficient {
  margin: 12px auto 0; padding: 14px 18px; max-width: 44em;
  font-family: var(--serif, Georgia, serif); font-style: italic;
  font-size: 17px; line-height: 1.65; color: #6e6557;
  background: rgba(151, 134, 110, .1); border-radius: 10px;
}
.ws-fi-head {
  max-width: 720px; margin: 0 auto 18px; text-align: left;
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 16px;
}
.ws-fi-count { font-family: var(--serif, Georgia, serif); font-size: 20px; color: #4c443b; }
.ws-fi-learned { font-family: var(--sans); font-size: 13.5px; color: #8a8574; }
.ws-fi-list { max-width: 720px; margin: 0 auto; }
.ws-fi-card {
  text-align: left; margin: 0 0 22px; padding: 26px 30px 18px;
  background: #fdf8ec; border: 1px solid rgba(163, 118, 47, .2); border-radius: 12px;
  opacity: 0; animation: alfNodeIn .7s cubic-bezier(.3,.6,.3,1) forwards;
}
@media (prefers-reduced-motion: reduce) { .ws-fi-card { animation: none; opacity: 1; } }
.ws-fi-top {
  display: flex; align-items: baseline; justify-content: space-between;
  flex-wrap: wrap; gap: 6px 16px; margin-bottom: 12px;
}
.ws-fi-kicker {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px;
  font-family: var(--sans); font-size: 13px; font-weight: 600;
  letter-spacing: .18em; text-transform: uppercase; color: #8a5a2e;
}
.ws-fi-num { color: #b08847; letter-spacing: .06em; }
.ws-fi-dot { color: #c9a76e; font-weight: 400; }
.ws-fi-contested { margin-left: 8px; font-weight: 500; letter-spacing: .1em; color: #a0582a; }
.ws-fi-fresh { font-family: var(--sans); font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: #6e6557; }
.ws-fi-fresh.fresh { color: #55663f; }
.ws-fi-fresh.recent { color: #46617e; }
.ws-fi-fresh.stale { color: #8a5a2e; }
.ws-fi-headline {
  margin: 0; font-family: var(--serif, Georgia, serif); font-weight: 500;
  font-size: clamp(21px, 2.4vw, 24px); line-height: 1.35; color: #3f3830;
}
.ws-fi-detail { margin-top: 6px; font-family: var(--sans); font-size: 14px; line-height: 1.6; color: #7a7263; }
.ws-fi-why { margin-top: 18px; }
.ws-fi-label {
  margin-bottom: 4px; font-family: var(--sans); font-size: 12.5px; font-weight: 600;
  letter-spacing: .2em; text-transform: uppercase; color: #a3762f;
}
.ws-fi-why-text { font-family: var(--sans); font-size: 16.5px; line-height: 1.65; color: #4f4a42; }
.ws-fi-prov { margin-top: 14px; font-family: var(--sans); font-size: 13.5px; line-height: 1.6; color: #7a7263; }
.ws-fi-label-inline {
  margin-right: 6px; font-size: 12px; font-weight: 600; letter-spacing: .16em;
  text-transform: uppercase; color: #a3762f;
}
.ws-fi-actions { margin-top: 20px; display: flex; align-items: center; flex-wrap: wrap; gap: 12px 24px; }
.ws-fi-primary {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 10px 20px;
  font-family: var(--sans); font-size: 14px; font-weight: 500; letter-spacing: .12em;
  text-transform: uppercase; text-decoration: none; cursor: pointer;
  color: #fdf8ec; background: #6b4a24; border: 1px solid #6b4a24; border-radius: 6px;
}
.ws-fi-primary:hover, .ws-fi-primary[aria-expanded="true"] { background: #573b1c; border-color: #573b1c; color: #fdf8ec; }
.ws-fi-primary.quiet { color: #6b4a24; background: transparent; }
.ws-fi-primary.quiet:hover { color: #573b1c; background: rgba(107, 74, 36, .08); }
.ws-fi-unavailable { font-family: var(--sans); font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: #8a8574; }
.ws-fi-secondary { display: flex; flex-wrap: wrap; gap: 4px 22px; }
.ws-fi-link {
  min-height: 40px; padding: 8px 0; background: none; border: 0; border-bottom: 1px solid transparent;
  font-family: var(--sans); font-size: 14px; letter-spacing: .1em; text-transform: uppercase;
  color: #6b4a24; cursor: pointer;
}
.ws-fi-link:hover, .ws-fi-link[aria-expanded="true"] { border-bottom-color: currentColor; }
.ws-fi-card :focus-visible, .ws-fi-drawer :focus-visible { outline: 2px solid #46617e; outline-offset: 3px; border-radius: 3px; }
.ws-fi-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.ws-fi-panel { margin-top: 16px; padding-top: 18px; border-top: 1px solid rgba(163, 118, 47, .18); }
.ws-fi-explain-dl { display: grid; gap: 14px; margin: 0; }
.ws-fi-explain-dl dt {
  font-family: var(--sans); font-size: 12.5px; font-weight: 600; letter-spacing: .2em;
  text-transform: uppercase; color: #a3762f;
}
.ws-fi-explain-dl dd { margin: 3px 0 0; font-family: var(--sans); font-size: 16px; line-height: 1.65; color: #4f4a42; }
.ws-fi-more { margin: 4px 0 0 18px; font-family: var(--sans); font-size: 14.5px; line-height: 1.65; color: #6e6557; }
.ws-fi-act-line { font-family: var(--serif, Georgia, serif); font-size: 19px; line-height: 1.5; color: #3f3830; }
.ws-fi-act-basis { margin-top: 6px; font-family: var(--sans); font-size: 14px; line-height: 1.55; color: #7a7263; }
.ws-fi-route { margin-top: 16px; font-family: var(--sans); font-size: 15px; line-height: 1.55; color: #55524b; }
.ws-fi-route .ws-fi-link { margin-left: 4px; }
.ws-fi-postings { margin-top: 14px; }
.ws-fi-postings ul { list-style: none; margin: 4px 0 0; padding: 0; }
.ws-fi-postings li { padding: 9px 0; border-bottom: 1px dotted rgba(163, 118, 47, .25); }
.ws-fi-postings a { font-family: var(--sans); font-size: 16px; line-height: 1.45; color: #46617e; }
.ws-fi-posting-meta { display: block; margin-top: 2px; font-family: var(--sans); font-size: 13.5px; color: #8a8574; }
.ws-fi-fb { margin-top: 18px; padding-top: 12px; border-top: 1px solid rgba(163, 118, 47, .12); }
.ws-fi-fb-q { margin-bottom: 6px; font-family: var(--sans); font-size: 13.5px; color: #8a8574; }
.ws-fi-fb-opts { display: flex; flex-wrap: wrap; gap: 2px 4px; margin-left: -10px; }
.ws-fi-fb-btn {
  min-height: 36px; padding: 6px 10px; background: none; border: 1px solid transparent; border-radius: 6px;
  font-family: var(--sans); font-size: 14px; color: #6e6557; cursor: pointer;
}
.ws-fi-fb-btn:hover { background: rgba(151, 134, 110, .1); color: #4c443b; }
.ws-fi-fb-btn.on { color: #3f5a2e; background: rgba(125, 155, 98, .12); border-color: rgba(85, 102, 63, .3); }
.ws-fi-fb-btn:disabled { opacity: .5; cursor: default; }
.ws-fi-fb-note { min-height: 1.5em; margin-top: 4px; font-family: var(--sans); font-size: 14px; line-height: 1.5; color: #55663f; }
.ws-fi-fb-note.err { color: #a0582a; }
.ws-fi-follow { margin-top: 6px; font-family: var(--sans); font-size: 15px; line-height: 1.55; color: #4f4a42; }
.ws-fi-follow-opts { display: flex; flex-wrap: wrap; gap: 2px 4px; margin: 4px 0 0 -10px; }
/* the evidence drawer: a dialog above the workspace overlay (.dx is 110) */
.ws-fi-drawer {
  position: fixed; inset: 0; z-index: 160; display: flex; align-items: flex-end; justify-content: center;
  padding: 20px; background: rgba(60, 45, 25, .42);
}
.ws-fi-drawer-panel {
  position: relative; width: min(620px, 100%); max-height: 86vh; overflow: auto; text-align: left;
  padding: 28px 28px 24px; background: #fffdf6; border-radius: 14px; box-shadow: 0 18px 60px rgba(60, 45, 25, .3);
}
.ws-fi-drawer-close {
  position: absolute; top: 8px; right: 10px; width: 44px; height: 44px;
  background: none; border: 0; font-size: 28px; line-height: 1; color: #8a8574; cursor: pointer;
}
.ws-fi-drawer-claim { margin: 4px 0 20px; font-family: var(--serif, Georgia, serif); font-size: 20px; line-height: 1.45; color: #3f3830; }
.ws-fi-drawer-dl {
  display: grid; grid-template-columns: minmax(110px, auto) 1fr; gap: 8px 18px;
  margin: 0 0 16px; padding-bottom: 16px; border-bottom: 1px solid rgba(163, 118, 47, .15);
}
.ws-fi-drawer-dl dt { padding-top: 2px; font-family: var(--sans); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: #a08a5e; }
.ws-fi-drawer-dl dd { margin: 0; font-family: var(--sans); font-size: 15px; line-height: 1.55; color: #4c443b; overflow-wrap: anywhere; }
.ws-fi-drawer-dl a { color: #46617e; }
@media (min-width: 700px) { .ws-fi-drawer { align-items: center; } }
@media (max-width: 560px) {
  .ws-fi-card { padding: 20px 18px 14px; }
  .ws-fi-actions { flex-direction: column; align-items: stretch; gap: 8px; }
  .ws-fi-primary { justify-content: center; }
  .ws-fi-drawer { padding: 0; }
  .ws-fi-drawer-panel { max-height: 92vh; padding: 26px 20px 22px; border-radius: 14px 14px 0 0; }
  .ws-fi-drawer-dl { grid-template-columns: 1fr; gap: 0; }
  .ws-fi-drawer-dl dd { margin-bottom: 10px; }
}

/* ============ dynamic-intelligence presentation (docs/dynamic-intelligence-ui.md) ============ */

/* the uncertainty list: each unknown clamps to two lines until asked (§6/§11);
   expansion is keyboard-reachable, not hover-only */
.dx-gap-why {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; cursor: pointer;
}
.dx-gap-why.open { display: block; -webkit-line-clamp: unset; overflow: visible; }
.dx-gap-why:focus-visible { outline: 1px solid rgba(200, 150, 84, .6); outline-offset: 2px; }

/* skeletons: shaped like the component they become, never a large empty card (§21) */
.dx-skel { border-radius: 8px; background: rgba(163, 118, 47, .1); position: relative; overflow: hidden; }
.dx-skel::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(100deg, transparent 30%, rgba(255, 252, 245, .6) 50%, transparent 70%);
  animation: dxSkelSweep 1.6s ease-in-out infinite;
}
@keyframes dxSkelSweep { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
.dx-skel-line { height: 13px; margin-top: 8px; }

.dx-skel-line.w60 { width: 60%; }
.dx-skel-line.w85 { width: 85%; }

@media (prefers-reduced-motion: reduce) { .dx-skel::after { animation: none; } }

/* snapshot lifecycle: the space already exists — freshness is a whisper */
.ws-snap-fresh, .ws-snap-updating {
  margin: 4px 0 0; font-size: .78rem; letter-spacing: .02em;
  color: rgba(74, 56, 30, .55);
}
.ws-snap-updating { font-style: italic; }
.ws-snap-skel { margin-top: 16px; }

/* ================= COMPARE TWO PATHS (ws-cmp-*, compare_v2) =================
   A decision instrument, not a report: one strong state, then the transfer
   map, what the path asks, compact source-backed signals, what we don't
   know, what would change the answer, and the two experiments. Editorial
   sections and rows — never a grid of identical cards. Type: frame 32–44px,
   section heads 22–28px, body 16–17px, metadata 12–13px. Below 700px every
   two-column row stacks Path A over Path B. */
.ws-cmp, .ws-cmp-setup { max-width: 920px; margin: 0 auto; text-align: left; min-width: 0; overflow-wrap: anywhere; }
/* the workspace body is a flex item: without min-width:0 it refuses to shrink
   below its content and the whole page slides off a phone screen */
.dx-ws .ws-body, .dx-ws .ws-detail { min-width: 0; max-width: 100%; }
.ws-cmp-kicker {
  font-family: var(--sans); font-size: 12px; letter-spacing: .38em; text-transform: uppercase;
  color: #a3762f; margin: 0 0 10px;
}
.ws-cmp-frame {
  font-family: var(--serif); font-weight: 500; font-size: clamp(30px, 4.2vw, 44px);
  line-height: 1.15; color: #4c443b; max-width: 20em; margin: 0;
}
.ws-cmp-sec-h { font-family: var(--serif); font-weight: 500; font-size: clamp(22px, 2.6vw, 28px); color: #55483a; line-height: 1.25; margin: 0 0 14px; }
.ws-cmp-body { font-family: var(--serif); font-size: 17px; line-height: 1.6; color: #4c443b; max-width: 40em; margin: 10px 0; }
.ws-cmp-meta, .ws-cmp-dim { font-family: var(--sans); font-size: 12.5px; line-height: 1.5; color: #8a8574; margin: 6px 0; }
.ws-cmp-k {
  font-family: var(--sans); font-size: 12px; letter-spacing: .22em; text-transform: uppercase;
  color: #a08a5e; margin: 14px 0 8px;
}
.ws-cmp-sub { display: block; font-family: var(--sans); font-size: 13px; color: #8a8574; line-height: 1.45; margin-top: 2px; }

/* ---- setup ---- */
.ws-cmp-setup { padding-top: 12px; }
.ws-cmp-slots { display: grid; grid-template-columns: 1fr auto 1fr; gap: 20px; align-items: stretch; margin-top: 30px; }
.ws-cmp-slot { padding: 24px 22px; background: #fdf8ec; border-radius: 18px; border: 1px solid rgba(163,118,47,.22); }
.ws-cmp-slot em { display: block; font-style: normal; font-family: var(--sans); font-size: 11px; letter-spacing: .34em; text-transform: uppercase; color: #a3762f; margin-bottom: 12px; }
.ws-cmp-slot-title { font-family: var(--serif); font-size: 24px; color: #4c443b; line-height: 1.25; }
.ws-cmp-slot-hint { font-family: var(--sans); font-size: 12.5px; color: #8a8574; margin-top: 8px; line-height: 1.5; }
.ws-cmp-slot-change { margin-top: 12px; background: none; border: 0; padding: 0; font-family: var(--sans); font-size: 12px; letter-spacing: .06em; color: #8a5f24; text-decoration: underline; cursor: pointer; }
.ws-cmp-select, .ws-cmp-custom {
  width: 100%; font-family: var(--serif); font-size: 17px; color: #4c443b;
  padding: 12px 14px; border: 1px solid rgba(163,118,47,.3); border-radius: 12px; background: #fffdf6; margin-top: 4px;
}
.ws-cmp-custom { margin-top: 10px; }
.ws-cmp-against { align-self: center; font-family: var(--serif); font-style: italic; font-size: 22px; color: #8a8574; }
.ws-cmp-start-row { text-align: center; margin-top: 26px; }
.ws-cmp-arrow { display: block; font-family: var(--serif); font-size: 26px; color: #c0a874; margin-bottom: 10px; }
.ws-cmp-start {
  font-family: var(--sans); font-size: 13px; letter-spacing: .28em; text-transform: uppercase;
  padding: 18px 34px; border-radius: 999px; cursor: pointer; color: #fdf8ec;
  background: linear-gradient(178deg, #8a5f24, #c07a45); border: 1px solid rgba(138,95,36,.6);
  box-shadow: 0 8px 26px rgba(192,122,69,.28); transition: transform .3s ease, box-shadow .3s ease, opacity .3s ease;
}
.ws-cmp-start span { display: inline-block; margin-left: 8px; transition: transform .3s ease; }
.ws-cmp-start:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 12px 34px rgba(192,122,69,.36); }
.ws-cmp-start:hover:not(:disabled) span { transform: translateX(4px); }
.ws-cmp-start:disabled { opacity: .45; cursor: not-allowed; }
.ws-cmp-start-note { margin: 14px auto 0; max-width: 34em; font-family: var(--serif); font-size: 16px; line-height: 1.5; color: #6d6154; }

/* ---- loading: phases that flip only when the engine finished them ---- */
.ws-cmp-loading { margin: 30px auto; max-width: 520px; min-height: 200px; }
.ws-cmp-loading-note { font-family: var(--serif); font-style: italic; font-size: 17px; color: #6d6154; margin-bottom: 18px; }
.ws-cmp-phases { list-style: none; margin: 0; padding: 0; }
.ws-cmp-phases li { display: flex; align-items: center; gap: 14px; padding: 9px 0; font-family: var(--serif); font-size: 18px; color: #a39a8b; border-top: 1px solid rgba(163,118,47,.12); transition: color .4s ease; }
.ws-cmp-phases li:first-child { border-top: 0; }
.ws-cmp-phase-mark { width: 26px; text-align: center; font-family: var(--sans); font-size: 14px; color: #a3762f; }
.ws-cmp-phases li[data-status="running"] { color: #55483a; }
.ws-cmp-phases li[data-status="running"] .ws-cmp-phase-mark::after { content: "•••"; letter-spacing: .1em; animation: cmpPulse 1.2s ease-in-out infinite; }
.ws-cmp-phases li[data-status="done"] { color: #4c443b; }
.ws-cmp-phases li[data-status="done"] .ws-cmp-phase-mark::after { content: "✓"; color: #55663f; }
@keyframes cmpPulse { 0%, 100% { opacity: .35; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .ws-cmp-phases li[data-status="running"] .ws-cmp-phase-mark::after { animation: none; } }

/* ---- results ---- */
.ws-cmp-head { margin: 6px 0 10px; }
.ws-cmp-paths { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 22px; }
.ws-cmp-path { padding: 14px 18px; border-radius: 14px; background: #fdf8ec; border: 1px solid rgba(163,118,47,.22); }
.ws-cmp-path[data-side="b"] { background: #f8f3ea; border-color: rgba(110,139,168,.35); }
.ws-cmp-path em { display: block; font-style: normal; font-family: var(--sans); font-size: 10.5px; letter-spacing: .3em; text-transform: uppercase; color: #a08a5e; margin-bottom: 4px; }
.ws-cmp-path p { font-family: var(--serif); font-weight: 500; font-size: clamp(19px, 2.2vw, 23px); color: #4c443b; line-height: 1.3; }
.ws-cmp-sec { margin-top: 44px; padding-top: 26px; border-top: 1px solid rgba(163,118,47,.16); }
.ws-cmp-sec.primary { border-top: 0; padding: 30px 30px 26px; margin-top: 30px; background: linear-gradient(180deg, #fdf8ec, #fbf5e6); border-radius: 22px; border: 1px solid rgba(163,118,47,.26); }
.ws-cmp-sec.centre { }
.ws-cmp-sec.routes { border-top: 0; margin-top: 30px; }
.ws-cmp-verdict { font-family: var(--serif); font-weight: 500; font-size: clamp(24px, 3.2vw, 34px); line-height: 1.25; color: #4c443b; max-width: 24em; margin: 4px 0 12px; }
.ws-cmp-state { margin: 0 0 8px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ws-cmp-delta { margin-top: 22px; padding: 14px 18px; background: rgba(125,155,98,.12); border: 1px solid rgba(125,155,98,.4); border-radius: 14px; }
.ws-cmp-delta ul { list-style: none; margin: 0; padding: 0; }
.ws-cmp-delta li { font-family: var(--sans); font-size: 13.5px; color: #4c443b; padding: 3px 0; }
.ws-cmp-delta li strong { font-weight: 500; text-transform: capitalize; }

.ws-cmp-pill {
  display: inline-block; font-family: var(--sans); font-size: 11px; letter-spacing: .14em;
  text-transform: uppercase; border-radius: 999px; padding: 3px 10px; vertical-align: middle;
  background: rgba(151,134,110,.14); color: #6e6557; white-space: nowrap;
}
.ws-cmp-pill.warn { background: rgba(192,90,60,.12); color: #8a3e2c; border: 1px solid rgba(192,90,60,.3); }
.ws-cmp-pill.state { font-size: 12px; padding: 5px 14px; }
.ws-cmp-pill.state.a_ahead, .ws-cmp-pill.state.b_ahead { background: rgba(163,118,47,.16); color: #8a5f24; }
.ws-cmp-pill.state.too_close_to_call { background: rgba(151,134,110,.16); color: #6e6557; border: 1px dashed rgba(151,134,110,.6); }
.ws-cmp-pill.state.insufficient_evidence { background: transparent; color: #8a8574; border: 1px dashed rgba(151,134,110,.6); }
.ws-cmp-pill.t-retained { background: rgba(125,155,98,.18); color: #55663f; }
.ws-cmp-pill.t-transferable { background: rgba(125,155,98,.12); color: #5e7048; }
.ws-cmp-pill.t-partial { background: rgba(192,122,69,.14); color: #8a5a2e; }
.ws-cmp-pill.t-new { background: rgba(110,139,168,.16); color: #46617e; }
.ws-cmp-pill.t-not_relevant { background: transparent; color: #a08a5e; border: 1px solid rgba(163,118,47,.22); }
.ws-cmp-pill.t-unknown { background: transparent; color: #8a8574; border: 1px dashed rgba(151,134,110,.6); }
.ws-cmp-pill.s-available { background: rgba(125,155,98,.18); color: #55663f; }
.ws-cmp-pill.s-partial { background: rgba(192,122,69,.14); color: #8a5a2e; }
.ws-cmp-pill.s-missing { background: rgba(192,90,60,.12); color: #8a3e2c; }
.ws-cmp-pill.s-likely_missing { background: rgba(192,90,60,.08); color: #8a3e2c; border: 1px dashed rgba(192,90,60,.4); }
.ws-cmp-pill.s-unknown { background: transparent; color: #8a8574; border: 1px dashed rgba(151,134,110,.6); }
.ws-cmp-pill.ev-you { background: rgba(125,155,98,.16); color: #55663f; }
.ws-cmp-pill.ev-world { background: rgba(110,139,168,.16); color: #46617e; }
.ws-cmp-pill.ev-struct { background: rgba(151,134,110,.14); color: #6e6557; }
.ws-cmp-pill.etype { font-size: 12px; margin-left: 6px; }
.ws-cmp-pill.etype.observed, .ws-cmp-pill.etype.measured { background: rgba(110,139,168,.18); color: #46617e; }
.ws-cmp-pill.etype.forecast, .ws-cmp-pill.etype.reported { background: rgba(192,122,69,.14); color: #8a5a2e; }
.ws-cmp-pill.etype.inferred, .ws-cmp-pill.etype.unknown { background: transparent; color: #8a8574; border: 1px dashed rgba(151,134,110,.6); }

/* three readings, kept apart */
.ws-cmp-tablewrap { overflow-x: auto; margin-top: 16px; }
.ws-cmp-signals { width: 100%; border-collapse: collapse; font-family: var(--sans); }
.ws-cmp-signals th { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: #a08a5e; font-weight: 400; text-align: left; padding: 8px 10px; }
.ws-cmp-signals th[scope="row"] { font-family: var(--serif); font-size: 16px; letter-spacing: 0; text-transform: none; color: #4c443b; }
.ws-cmp-signals th[scope="row"] em { font-style: normal; font-family: var(--sans); font-size: 11px; letter-spacing: .2em; color: #a3762f; margin-right: 8px; }
.ws-cmp-signals td { padding: 8px 10px; border-top: 1px solid rgba(163,118,47,.14); }
.ws-cmp-signals tbody tr:first-child td { border-top: 1px solid rgba(163,118,47,.14); }
.ws-cmp-level { font-family: var(--serif); font-size: 18px; color: #4c443b; }
.ws-cmp-level.high { color: #55663f; }
.ws-cmp-level.moderate { color: #8a5a2e; }
.ws-cmp-level.low { color: #8a3e2c; }
.ws-cmp-level.unknown { color: #a39a8b; font-style: italic; }
.ws-cmp-level.no_direction { color: #46617e; font-style: italic; font-size: 16px; }
.ws-cmp-unc td { font-family: var(--serif); font-size: 17px; color: #4c443b; text-transform: capitalize; }
.ws-cmp-because { margin-top: 18px; }
.ws-cmp-because.alt { padding: 14px 18px; background: rgba(110,139,168,.08); border-radius: 14px; }
.ws-cmp-because.alt .ws-cmp-k { margin-top: 0; color: #46617e; }
.ws-cmp-lines { list-style: none; margin: 0; padding: 0; }
.ws-cmp-lines li { padding: 8px 0; border-top: 1px solid rgba(163,118,47,.12); font-family: var(--serif); font-size: 16.5px; line-height: 1.5; color: #4c443b; }
.ws-cmp-lines li:first-child { border-top: 0; padding-top: 0; }
.ws-cmp-lines li strong { font-weight: 500; }
.ws-cmp-lines li em { font-style: normal; font-family: var(--sans); font-size: 11px; letter-spacing: .2em; color: #a3762f; margin-right: 8px; }
.ws-cmp-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; align-items: start; margin-top: 18px; }
.ws-cmp-col-h { font-family: var(--serif); font-size: 18px; color: #55483a; margin-bottom: 8px; line-height: 1.3; }
.ws-cmp-col-h em { font-style: normal; font-family: var(--sans); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: #a3762f; margin-right: 8px; }

/* what you keep / have */
.ws-cmp-keep { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px 22px; }
.ws-cmp-keep-row { padding: 10px 0; border-top: 1px solid rgba(163,118,47,.12); font-family: var(--serif); font-size: 17px; color: #4c443b; }
.ws-cmp-have { margin-top: 4px; }
.ws-cmp-have-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 16px; align-items: baseline; padding: 8px 0; border-top: 1px solid rgba(163,118,47,.12); font-family: var(--serif); font-size: 16.5px; color: #4c443b; }
.ws-cmp-have-row .ws-cmp-sub { grid-column: 1 / -1; }
.ws-cmp-have-strength { font-family: var(--sans); font-size: 11px; letter-spacing: .22em; text-transform: uppercase; }
.ws-cmp-have-strength.strong { color: #55663f; }
.ws-cmp-have-strength.moderate { color: #8a5a2e; }
.ws-cmp-have-strength.unknown { color: #a39a8b; }

/* the transfer map */
.ws-cmp-transfer { margin-top: 12px; }
.ws-cmp-trow { display: grid; grid-template-columns: minmax(150px, 1fr) 22px auto minmax(0, 2fr); gap: 4px 12px; align-items: baseline; padding: 10px 0; border-top: 1px solid rgba(163,118,47,.12); }
.ws-cmp-trow-cap { font-family: var(--serif); font-size: 17px; color: #4c443b; }
.ws-cmp-trow-arrow { color: #c0a874; font-family: var(--serif); }
.ws-cmp-trow-line { font-family: var(--sans); font-size: 13px; color: #8a8574; line-height: 1.45; }
.ws-cmp-trow-line i { font-style: normal; color: #a08a5e; }
.ws-cmp-trow.new .ws-cmp-trow-cap { color: #46617e; }
.ws-cmp-trow.unknown .ws-cmp-trow-cap { color: #8a8574; }
.ws-cmp-acts { list-style: none; margin: 0; padding: 0; }
.ws-cmp-acts li { padding: 7px 0; border-top: 1px solid rgba(163,118,47,.12); font-family: var(--serif); font-size: 16.5px; color: #4c443b; }
.ws-cmp-acts li:first-child { border-top: 0; }
.ws-cmp-acts li.new { color: #46617e; }
.ws-cmp-axes { list-style: none; margin: 0; padding: 0; }
.ws-cmp-axes li { padding: 6px 0; font-family: var(--serif); font-size: 16px; color: #4c443b; }
.ws-cmp-axes li em { font-style: normal; font-family: var(--sans); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: #a3762f; margin-right: 8px; }
.ws-cmp-axes li b { color: #a3762f; margin: 0 6px; font-weight: 500; }

/* asks */
.ws-cmp-askgroup { margin-top: 6px; }
.ws-cmp-ask { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 14px; align-items: baseline; padding: 9px 0; border-top: 1px solid rgba(163,118,47,.12); }
.ws-cmp-ask-item { font-family: var(--serif); font-size: 17px; color: #4c443b; }
.ws-cmp-ask .ws-cmp-sub { grid-column: 1 / -1; }

/* world evidence */
.ws-cmp-signal { padding: 12px 0; border-top: 1px solid rgba(110,139,168,.2); }
.ws-cmp-signal:first-of-type { border-top: 0; }
.ws-cmp-signal-head { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; font-family: var(--serif); font-size: 17px; color: #4c443b; }
.ws-cmp-signal-head strong { font-weight: 500; }
.ws-cmp-signal-val { font-family: var(--serif); font-size: 18px; color: #46617e; text-align: right; }
.ws-cmp-signal.contested .ws-cmp-signal-val { color: #8a5a2e; text-transform: none; }
.ws-cmp-signal-sum { font-family: var(--sans); font-size: 13.5px; color: #6e6557; line-height: 1.5; margin-top: 3px; }
.ws-cmp-source-line { font-family: var(--sans); font-size: 12.5px; color: #8a8574; margin-top: 6px; line-height: 1.6; }
.ws-cmp-source-line .ws-cmp-k { display: inline; margin: 0 8px 0 0; }
.ws-cmp-open-source { margin-left: 8px; background: none; border: 1px solid rgba(110,139,168,.4); border-radius: 999px; padding: 2px 10px; font-family: var(--sans); font-size: 11px; letter-spacing: .1em; color: #46617e; cursor: pointer; }
.ws-cmp-why { font-family: var(--serif); font-size: 15.5px; line-height: 1.5; color: #4c443b; margin-top: 8px; }
.ws-cmp-why .ws-cmp-k { display: block; margin: 0 0 2px; }
.ws-cmp-open { margin-top: 12px; }
.ws-cmp-open summary { font-family: var(--sans); font-size: 12.5px; letter-spacing: .06em; color: #8a8574; cursor: pointer; }
.ws-cmp-open ul { list-style: none; margin: 8px 0 0; padding: 0; }
.ws-cmp-open li { padding: 6px 0; font-family: var(--serif); font-size: 15.5px; color: #4c443b; border-top: 1px solid rgba(163,118,47,.1); }
.ws-cmp-open li strong { font-weight: 500; margin-right: 6px; }
.ws-cmp-note { margin-top: 14px; font-family: var(--sans); font-size: 13px; color: #6e6557; padding: 10px 14px; background: rgba(163,118,47,.06); border-radius: 12px; }
.ws-cmp-refresh-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 14px; }

/* what would change */
.ws-cmp-vars { margin: 0; padding-left: 1.4em; }
.ws-cmp-vars li { padding: 8px 0; font-family: var(--serif); font-size: 18px; color: #4c443b; border-top: 1px solid rgba(163,118,47,.12); }
.ws-cmp-vars li::marker { font-family: var(--sans); font-size: 12px; color: #a3762f; }
.ws-cmp-vars li strong { font-weight: 500; }

/* experiments */
.ws-cmp-exp { padding: 20px 22px; border-radius: 18px; background: #fdf8ec; border: 1px solid rgba(163,118,47,.22); }
.ws-cmp-exp[data-side="b"] { border-color: rgba(110,139,168,.35); }
.ws-cmp-expdl { margin: 6px 0 0; }
.ws-cmp-expdl dt { font-family: var(--sans); font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: #a08a5e; margin-top: 12px; }
.ws-cmp-expdl dd { margin: 3px 0 0; font-family: var(--serif); font-size: 16.5px; line-height: 1.5; color: #4c443b; }
.ws-cmp-outcome { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.ws-cmp-outcome .ws-cmp-k { flex-basis: 100%; margin: 0 0 4px; }
.ws-cmp-outcome .dx-pill { font-size: 10px; padding: 9px 14px; text-indent: 0; letter-spacing: .14em; }
.ws-cmp-tested { margin-top: 12px; font-family: var(--serif); font-style: italic; font-size: 15.5px; color: #55663f; }

/* product routes — quiet, need-first */
.ws-cmp-routes { display: grid; gap: 12px; }
.ws-cmp-route { padding: 16px 20px; border-radius: 14px; background: rgba(163,118,47,.06); display: flex; justify-content: space-between; gap: 16px; align-items: center; flex-wrap: wrap; }
.ws-cmp-route .ws-cmp-body { margin: 0; }
.ws-cmp-route-go { background: none; border: 0; padding: 0; font-family: var(--sans); font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: #8a5f24; cursor: pointer; }
.ws-cmp-route-go.picked { opacity: .6; }
.ws-cmp-foot { margin-top: 36px; text-align: center; }

/* evidence drawer */
.ws-cmp-drawer { position: fixed; inset: 0; z-index: 160; background: rgba(60,45,25,.42); display: flex; align-items: flex-end; justify-content: center; padding: 20px; }
.ws-cmp-drawer-panel { position: relative; width: min(560px, 100%); max-height: 86vh; overflow: auto; background: #fffdf6; border-radius: 20px; padding: 26px 26px 28px; box-shadow: 0 18px 60px rgba(60,45,25,.3); }
.ws-cmp-drawer-close { position: absolute; top: 12px; right: 14px; background: none; border: 0; font-size: 26px; line-height: 1; color: #8a8574; cursor: pointer; }
.ws-cmp-drawer-dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 18px; margin: 4px 0 0; }
.ws-cmp-drawer-dl dt { font-family: var(--sans); font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: #a08a5e; padding-top: 3px; }
.ws-cmp-drawer-dl dd { margin: 0; font-family: var(--serif); font-size: 16px; color: #4c443b; line-height: 1.45; }
.ws-cmp-drawer-claim { font-family: var(--serif); font-size: 17px; line-height: 1.5; color: #4c443b; }
.ws-cmp-drawer-link { display: inline-block; margin-top: 16px; font-family: var(--sans); font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: #46617e; }
@media (min-width: 700px) { .ws-cmp-drawer { align-items: center; } }

@media (max-width: 900px) {
  .ws-cmp-sec.primary { padding: 22px 20px; }
}
@media (max-width: 700px) {
  .ws-cmp-slots { grid-template-columns: 1fr; gap: 12px; }
  .ws-cmp-against { text-align: center; }
  .ws-cmp-paths { grid-template-columns: 1fr; gap: 10px; }
  .ws-cmp-cols { grid-template-columns: 1fr; gap: 18px; }
  .ws-cmp-col[data-side="b"], .ws-cmp-exp[data-side="b"] { border-top: 1px dashed rgba(110,139,168,.35); padding-top: 14px; }
  .ws-cmp-exp[data-side="b"] { padding-top: 20px; }
  .ws-cmp-trow { grid-template-columns: 1fr auto; }
  .ws-cmp-trow-arrow { display: none; }
  .ws-cmp-trow-line { grid-column: 1 / -1; }
  .ws-cmp-keep { grid-template-columns: 1fr; }
  .ws-cmp-signal-head { flex-direction: column; gap: 2px; }
  .ws-cmp-verdict { font-size: 24px; }
  .ws-cmp-sec { margin-top: 34px; padding-top: 20px; }
}

/* ---- Compare 2 Paths: employed role vs employed role ---- */
.ws-cmp-frame.small { font-size: clamp(24px, 3vw, 32px); }
.ws-cmp-gate { margin: 26px auto 0; max-width: 640px; padding: 20px 22px; background: rgba(163,118,47,.06); border-radius: 16px; }
.ws-cmp-gate .ws-cmp-kicker { margin-bottom: 8px; }
/* the privacy promise is the first thing read before a salary box, so it
   leads with a label rather than sitting in a paragraph of body copy */
.ws-cmp-privacy {
  padding: 14px 16px; background: rgba(125,155,98,.12); border-radius: 12px;
  font-size: 15px; line-height: 1.55; color: #4f5a3e;
}
.ws-cmp-privacy-k {
  display: inline-block; margin-right: 8px; font-family: var(--sans);
  font-size: 12px; letter-spacing: .2em; text-transform: uppercase;
  color: #55663f; vertical-align: 1px;
}
.ws-cmp-qs { margin-top: 18px; display: grid; gap: 18px; }
.ws-cmp-q label { display: block; font-family: var(--serif); font-size: 19px; color: #4c443b; margin-bottom: 8px; }
/* amount and currency: the code needs only a few characters, so the box is
   sized for a code and centred rather than left-aligned in a wide field */
.ws-cmp-money { display: grid; grid-template-columns: minmax(0, 1fr) 108px; gap: 10px; }
.ws-cmp-money .ws-cmp-custom { margin-top: 0; }
.ws-cmp-cur { text-align: center; letter-spacing: .12em; text-transform: uppercase; }
.ws-cmp-cur-help { margin-top: 8px; }
/* the amount read back in the currency the person chose, so a mistyped code
   or a missing zero is visible before the engine runs */
.ws-cmp-echo {
  margin-top: 8px; font-family: var(--serif); font-size: 15px; color: #6d5a3a;
}
.ws-cmp-hero { margin-top: 12px; }
.ws-cmp-hero-list { list-style: none; margin: 0; padding: 0; }
.ws-cmp-hero-list li { padding: 10px 0; border-top: 1px solid rgba(163,118,47,.12); font-family: var(--serif); font-size: 19px; color: #4c443b; line-height: 1.35; }
.ws-cmp-hero-list li:first-child { border-top: 0; padding-top: 0; }
.ws-cmp-hero-list li b { font-family: var(--sans); font-weight: 500; margin-right: 8px; }
.ws-cmp-hero-list.yes li b { color: #55663f; }
.ws-cmp-hero-list.no li b { color: #46617e; }
.ws-cmp-hero-list.no li { color: #3f5470; }
.ws-cmp-matrix { margin-top: 6px; }
.ws-cmp-mrow { display: grid; grid-template-columns: 150px minmax(0, 1fr) minmax(0, 1fr); gap: 8px 22px; padding: 18px 0; border-top: 1px solid rgba(163,118,47,.16); align-items: start; }
.ws-cmp-mrow:first-child { border-top: 0; }
.ws-cmp-mlabel { font-family: var(--sans); font-size: 11px; letter-spacing: .28em; text-transform: uppercase; color: #a3762f; padding-top: 4px; }
.ws-cmp-mside { display: none; }
.ws-cmp-mcell[data-side="b"] { padding-left: 18px; border-left: 1px solid rgba(110,139,168,.25); }
.ws-cmp-mnote { grid-column: 2 / -1; margin-top: 6px; }
.ws-cmp-val { font-family: var(--serif); font-size: 21px; color: #46617e; line-height: 1.3; }
.ws-cmp-val.small { font-size: 16.5px; color: #4c443b; }
.ws-cmp-body.small { font-size: 16px; margin: 4px 0; }
.ws-cmp-sub.big { font-size: 14.5px; color: #4c443b; margin-top: 6px; }
@media (max-width: 760px) {
  .ws-cmp-mrow { grid-template-columns: 1fr; gap: 10px; }
  .ws-cmp-mside { display: block; font-family: var(--sans); font-size: 10.5px; letter-spacing: .28em; text-transform: uppercase; color: #a08a5e; margin-bottom: 4px; }
  .ws-cmp-mcell[data-side="b"] { padding-left: 0; border-left: 0; border-top: 1px dashed rgba(110,139,168,.35); padding-top: 12px; }
  .ws-cmp-mnote { grid-column: 1; }
  .ws-cmp-money { grid-template-columns: 1fr; }
}

/* ---- v6: boxes, limitations, the evidence-state table ---- */
.ws-cmp-box { padding: 20px 22px; border-radius: 18px; background: #fdf8ec; border: 1px solid rgba(163,118,47,.22); }
.ws-cmp-box[data-side="b"] { border-color: rgba(110,139,168,.35); }
.ws-cmp-limit { font-family: var(--serif); font-style: italic; font-size: 16px; line-height: 1.5; color: #6d6154; padding: 10px 14px; background: rgba(163,118,47,.06); border-radius: 12px; margin: 6px 0; }
.ws-cmp-contract { width: 100%; border-collapse: collapse; font-family: var(--sans); margin-top: 8px; }
.ws-cmp-contract th { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: #a08a5e; font-weight: 400; text-align: left; padding: 8px 10px; }
.ws-cmp-contract th[scope="row"] { font-family: var(--serif); font-size: 16px; letter-spacing: 0; text-transform: none; color: #4c443b; white-space: nowrap; }
.ws-cmp-contract th[scope="row"] em { font-style: normal; font-family: var(--sans); font-size: 12px; letter-spacing: .2em; color: #a3762f; margin-left: 6px; }
.ws-cmp-contract td { padding: 8px 10px; border-top: 1px solid rgba(163,118,47,.14); font-size: 13.5px; line-height: 1.5; color: #4c443b; vertical-align: top; }
.ws-cmp-contract tbody tr:first-child td { border-top: 1px solid rgba(163,118,47,.14); }
.ws-cmp-pill.cs.verified, .ws-cmp-pill.cs.supported { background: rgba(125,155,98,.18); color: #55663f; }
.ws-cmp-pill.cs.inferred { background: rgba(163,118,47,.14); color: #8a5f24; }
.ws-cmp-pill.cs.not_applicable { background: transparent; color: #8a8574; border: 1px solid rgba(163,118,47,.22); }
.ws-cmp-pill.cs.insufficient_evidence { background: transparent; color: #8a8574; border: 1px dashed rgba(151,134,110,.6); }
.ws-cmp-pill.cs.needs_user_input { background: rgba(110,139,168,.16); color: #46617e; }
.ws-cmp-pill.state.path_a_currently_stronger, .ws-cmp-pill.state.path_b_currently_stronger { background: rgba(163,118,47,.16); color: #8a5f24; }
@media (max-width: 760px) { .ws-cmp-contract th[scope="row"] { white-space: normal; } }

/* the evidence-state table stacks on a phone — never letter-wrapped columns */
.ws-cmp-contract, .ws-cmp-contract th, .ws-cmp-contract td { overflow-wrap: normal; }
@media (max-width: 760px) {
  .ws-cmp-contract thead { display: none; }
  .ws-cmp-contract, .ws-cmp-contract tbody, .ws-cmp-contract tr, .ws-cmp-contract th, .ws-cmp-contract td { display: block; }
  .ws-cmp-contract tr { padding: 12px 0; border-top: 1px solid rgba(163,118,47,.14); }
  .ws-cmp-contract th[scope="row"] { padding: 0 0 6px; }
  .ws-cmp-contract td { padding: 0; border-top: 0; }
  .ws-cmp-contract td + td { margin-top: 6px; }
}

/* ================= THE COMPLETENESS LAYER =================================
   What the page says when the evidence didn't establish something. A
   limitation is a real piece of intelligence, so it is typeset as one —
   quiet, three lines, never a red error and never an empty box. */

.dx-limit {
  margin-top: 12px; padding: 12px 14px; border-radius: 3px;
  background: rgba(151, 134, 110, .07);
  border-left: 2px solid rgba(151, 134, 110, .3);
}
.dx-limit-what {
  font-family: var(--sans); font-size: 10px; letter-spacing: .22em;
  text-transform: uppercase; color: #a3987f;
}
.dx-limit-why { margin-top: 7px; font-size: 13.5px; line-height: 1.6; color: #6e6355; }
.dx-limit-how { margin-top: 5px; font-size: 12.5px; line-height: 1.6; color: #8a7f6c; font-style: italic; }

.dx-limit-inline {
  margin-top: 10px; font-size: 12.5px; line-height: 1.65; color: #8a7f6c;
}
.dx-limit-k {
  font-family: var(--sans); font-size: 9.5px; letter-spacing: .22em;
  text-transform: uppercase; color: #a3987f; margin-right: 8px;
}

/* a stat that could not be read keeps its slot but drops its weight — the
   reader sees the shape of the strip, not a hole in it */
.dx-stat-basis {
  font-family: var(--sans); font-style: normal; font-size: 10px;
  color: #a3987f; letter-spacing: .04em; margin-top: 2px;
}
.dx-intel-stat.open b.dx-stat-open {
  font-family: var(--sans); font-size: 11.5px; font-weight: 400;
  color: #a3987f; line-height: 1.45; letter-spacing: 0;
}
.dx-edge-demand.d-open { color: #8a7f6c; background: rgba(151, 134, 110, .12); }
.dx-edge-mdetail {
  font-family: var(--sans); font-size: 10.5px; color: #a3987f; margin-left: 8px;
}
.ws-fi-limit { margin-top: 14px; }
.ws-mu-qwhy { margin-top: 5px; font-size: 12.5px; color: #8a795c; line-height: 1.55; }

/* the one clarification: an invitation, not a form */
.ws-clarify {
  margin-top: 22px; padding: 20px 22px; border-radius: 4px;
  background: rgba(196, 160, 92, .07);
  border: 1px solid rgba(196, 160, 92, .22);
}
.ws-clarify.sent { opacity: .75; }
.ws-clarify-k {
  font-family: var(--sans); font-size: 10px; letter-spacing: .26em;
  text-transform: uppercase; color: #a3762f;
}
.ws-clarify-q {
  margin-top: 10px; font-family: var(--serif); font-size: 19px;
  line-height: 1.45; color: #4c443b;
}
.ws-clarify-why { margin-top: 7px; font-size: 13px; line-height: 1.6; color: #8a795c; }
.ws-clarify-in { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.ws-clarify-text {
  flex: 1 1 260px; min-width: 0; padding: 9px 12px; font-family: var(--serif);
  font-size: 15px; color: #4c443b; background: rgba(255, 253, 249, .8);
  border: 1px solid rgba(151, 134, 110, .35); border-radius: 3px;
}
.ws-clarify-text:focus { outline: none; border-color: rgba(196, 160, 92, .7); }
.ws-clarify-keep {
  margin-top: 12px; display: flex; gap: 8px; align-items: flex-start;
  font-size: 12.5px; color: #8a795c; line-height: 1.5; cursor: pointer;
}
.ws-clarify-keep input { margin-top: 2px; }
.ws-clarify-note { margin-top: 8px; font-size: 11.5px; color: #a3987f; line-height: 1.55; }
.ws-clarify-err { margin-top: 8px; font-size: 12.5px; color: #8a5a2e; }

/* a requirement we cannot judge is not a deficiency — it reads as open, not
   as a red mark against the person */
.ws-poss-missing.open { color: #8a7f6c; font-style: normal; }
.ws-poss-sub { display: block; margin-top: 3px; font-size: 11.5px; color: #a3987f; }

/* ================= PROFESSIONAL INTELLIGENCE AUDIT ========================
   A report, not a dashboard: serif statements, quiet provenance, and the
   claim-versus-evidence rows as the one place the layout turns into columns. */

.pa { max-width: 760px; margin: 0 auto; }
.pa-loading { color: #8a795c; font-size: 14px; }
.pa-kicker, .pa-sec-k, .pa-src-k, .pa-cve-k, .pa-privacy-k, .pa-ai-k {
  font-family: var(--sans); font-size: 11.5px; letter-spacing: .22em;
  text-transform: uppercase; color: #a3762f; }
.pa-title { margin-top: 8px; font-family: var(--serif); font-size: clamp(24px, 3vw, 32px);
  font-weight: 500; line-height: 1.25; color: #4c443b; }
.pa-title.small { font-size: 20px; }
.pa-sub, .pa-lead { margin-top: 10px; font-size: 15px; line-height: 1.6; color: #6d5a3a; }
.pa-note { font-size: 12.5px; line-height: 1.6; color: #8a7f6c; }
.pa-note.open { color: #8a7f6c; font-style: normal; }

/* ================= PROFESSIONAL AUDIT · evidence =================
   The audit collects nothing of its own: this is what Discover gathered, the
   way to rebuild from it, and — for someone who brought nothing — the same
   evidence form Discover uses. */
.pa.pa-setup {
  --ps-ink: #3b332a; --ps-ink-2: #5c4e3d; --ps-ink-3: #7a6d59; --ps-ink-4: #a2957c;
  --ps-gold: #99702f; --ps-accent: #c2672c; --ps-good: #5b7042; --ps-bad: #9a4b24;
  --ps-rule: rgba(153, 112, 47, .2); --ps-paper: #fffaf1; --ps-focus: rgba(194, 103, 44, .55);
  --ps-num: 84px; --ps-gap: 36px;
  max-width: 1120px; margin: 0 auto; text-align: left; font-family: var(--sans); color: var(--ps-ink);
}
/* several setup elements set their own display; the attribute must still win */
.pa-setup [hidden] { display: none !important; }
.pa-setup-hero { max-width: 780px; margin: 6px auto 0; text-align: center; }
.pa-setup-eyebrow {
  font-family: var(--sans); font-size: 12.5px; font-weight: 500; letter-spacing: .28em;
  text-transform: uppercase; color: var(--ps-gold);
}
.pa-setup-title {
  margin-top: 14px; font-family: var(--serif); font-weight: 500;
  font-size: clamp(36px, 5vw, 56px); line-height: 1.08; letter-spacing: -.01em; color: var(--ps-ink);
}
.pa-setup-lede {
  margin: 18px auto 0; max-width: 36em; font-size: clamp(17px, 1.5vw, 19px); line-height: 1.6; color: var(--ps-ink-2);
}

/* sources on record, and the way back to building */
.pa-onrecord { list-style: none; max-width: 860px; margin: 40px auto 0; padding: 0; border-top: 1px solid var(--ps-rule); }
.pa-onrecord li {
  display: grid; grid-template-columns: minmax(0, 8em) minmax(0, 1fr) auto auto; align-items: baseline; gap: 6px 20px;
  padding: 16px 0; border-bottom: 1px solid var(--ps-rule);
}
.pa-onrecord-t { font-family: var(--serif); font-size: 22px; color: var(--ps-ink); }
.pa-onrecord-ref { min-width: 0; overflow-wrap: anywhere; font-size: 15px; color: var(--ps-ink-2); }
.pa-onrecord-s { font-size: 13.5px; color: var(--ps-ink-3); }
.pa-onrecord-s.ready { color: var(--ps-good); }
.pa-onrecord-s.failed { color: var(--ps-bad); }
.pa-evidence-build { max-width: 860px; margin: 26px auto 0; }
.pa-link {
  min-height: 36px; padding: 6px 0; background: none; border: 0; border-bottom: 1px solid transparent;
  font-family: var(--sans); font-size: 14.5px; color: var(--ps-gold); cursor: pointer;
}
.pa-link:hover { border-bottom-color: currentColor; }
.pa-link:disabled { opacity: .5; cursor: progress; }
.pa-build {
  width: min(460px, 100%); display: inline-flex; justify-content: center; align-items: center; gap: 12px;
  padding: 19px 30px; border-radius: 999px; cursor: pointer;
  font-family: var(--sans); font-size: 14px; font-weight: 500; letter-spacing: .24em; text-transform: uppercase;
  color: #fdf8ec; background: linear-gradient(178deg, #8a5f24, #c07a45); border: 1px solid rgba(138, 95, 36, .6);
  box-shadow: 0 8px 24px rgba(192, 122, 69, .26);
  transition: transform .2s ease, box-shadow .25s ease;
}
.pa-build span { transition: transform .25s ease; }
.pa-build:not(:disabled):hover { transform: translateY(-1px); box-shadow: 0 12px 30px rgba(192, 122, 69, .34); }
.pa-build:not(:disabled):hover span { transform: translateX(4px); }
.pa-build:disabled { opacity: .7; cursor: progress; }
.pa-build:focus-visible { outline: 2px solid var(--ps-focus); outline-offset: 3px; }
.pa-setup .pa-error { max-width: 860px; margin: 12px auto 0; font-size: 15px; line-height: 1.5; color: var(--ps-bad); }
@keyframes psIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: no-preference) {
  .pa-setup-hero, .pa-onrecord, .pa-evidence-form { animation: psIn .5s cubic-bezier(.3, .6, .3, 1) both; }
}
@media (max-width: 600px) {
  .pa-setup-hero { text-align: left; }
  .pa-setup-lede { margin-left: 0; }
  .pa-onrecord li { grid-template-columns: minmax(0, 1fr) auto; }
  .pa-onrecord-ref, .pa-onrecord-s { grid-column: 1 / -1; }
  .pa-build { width: 100%; }
}

/* ================= EVIDENCE SOURCES =================
   One form in two places: Discover's Chapter III invitation (on the journey's
   ivory) and the audit page for someone who arrived without sources. Rows
   ruled with hairlines, the inputs quiet, consent and what-we-keep in plain
   view before anything is read. */
.ev { width: min(620px, 100%); margin: 3.5vh auto 0; text-align: left; font-family: var(--sans); }
.ev [hidden] { display: none !important; }
.ev-eyebrow {
  margin-bottom: 18px; font-family: var(--sans); font-size: 10.5px; letter-spacing: .34em;
  text-transform: uppercase; color: #ab9668;
}
.ev-lead {
  margin-bottom: 20px; text-align: center; font-family: var(--serif); font-size: clamp(18px, 2.5vh, 22px);
  line-height: 1.45; color: #6e655b;
}
.ev-rows { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(178, 146, 94, .3); }
.ev-row {
  display: grid; grid-template-columns: minmax(0, 11em) minmax(0, 1fr); gap: 8px 24px; align-items: center;
  padding: 16px 2px; border-bottom: 1px solid rgba(178, 146, 94, .3);
}
.ev-row-intro { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ev-row-label { font-family: var(--serif); font-weight: 500; font-size: 21px; line-height: 1.2; color: #5a4f43; }
.ev-row-line { font-size: 12.5px; line-height: 1.4; color: #9b8d78; }
.ev-had { font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: #7d8a55; }
.ev-row-input { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.ev-url {
  width: 100%; min-width: 0; background: none; border: none; border-bottom: 1px solid rgba(178, 146, 94, .5);
  border-radius: 0; font-family: var(--serif); font-size: 18px; color: #4c443b; padding: 8px 2px; outline: none;
  transition: border-color .3s ease;
}
.ev-url:focus { border-color: rgba(216, 150, 80, .85); }
.ev-url::placeholder { color: #b3a48d; font-style: italic; }
.ev-url[aria-invalid="true"] { border-color: #b4553a; }
.ev-file { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.ev-pick {
  display: inline-block; padding: 10px 22px; border: 1px solid rgba(178, 146, 94, .55); border-radius: 40px;
  background: rgba(253, 248, 238, .7); cursor: pointer;
  font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: #8d6a2b;
  transition: border-color .3s ease, box-shadow .3s ease;
}
.ev-pick:hover, .ev-file:focus-visible + .ev-pick { border-color: rgba(216, 150, 80, .8); box-shadow: 0 0 18px rgba(226, 178, 106, .3); }
.ev-filename { min-width: 0; font-family: var(--serif); font-size: 16px; color: #6d6154; overflow-wrap: anywhere; }
.ev-filename.bad { color: #b4553a; }
.ev-own, .ev-consent { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; line-height: 1.45; color: #6e655b; cursor: pointer; }
.ev-own input, .ev-consent input { flex: none; width: 16px; height: 16px; margin: 2px 0 0; accent-color: #b98a3d; }
.ev-more {
  display: block; margin-top: 12px; padding: 6px 2px; background: none; border: none; cursor: pointer;
  font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: #ab9668;
}
.ev-more:hover { color: var(--orange); }
.ev-consent { margin-top: 24px; }
.ev-privacy { margin-top: 12px; font-size: 13px; line-height: 1.55; color: #7a6c58; }
.ev-privacy summary { width: fit-content; cursor: pointer; color: #8d6a2b; }
.ev-privacy p { margin-top: 8px; }
.ev-privacy ul { margin: 4px 0 6px 18px; }
.ev-privacy-k { margin-top: 12px; font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: #ab9668; }
.ev-note { font-size: 13px; line-height: 1.45; color: #9b8d78; }
.ev-error { margin-top: 14px; font-size: 14px; line-height: 1.5; color: #b4553a; }
.ev-actions { display: flex; flex-direction: column; align-items: center; }
.ev-actions .dx-commit { margin-top: 30px; }
.ev-actions .dx-commit.busy { opacity: .55; pointer-events: none; }
.ev-actions .dx-skip { margin-top: 18px; }
/* in My UNBIFY the form sits on the audit page's paper, under the hero */
.ev-audit { width: min(860px, 100%); margin-top: 34px; }
.ev-audit .ev-actions { align-items: flex-start; }
@media (max-width: 640px) {
  .ev-row { grid-template-columns: minmax(0, 1fr); gap: 8px; padding: 14px 0; }
  .ev-lead { text-align: left; }
}
.pa-privacy { margin-top: 18px; padding: 14px 16px; border-radius: 12px; background: rgba(125,155,98,.1);
  font-size: 13.5px; line-height: 1.6; color: #4f5a3e; }
.pa-privacy details { margin-top: 8px; }
.pa-privacy summary { cursor: pointer; font-size: 12.5px; color: #55663f; }
.pa-privacy ul { margin: 6px 0 10px 18px; }
.pa-privacy-k { margin-top: 10px; }
.pa-actions { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.pa-error { margin-top: 10px; font-size: 13px; color: #8a5a2e; }

.pa-phases { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 10px; }
.pa-phases li { display: grid; grid-template-columns: 34px 1fr; gap: 6px 10px; align-items: baseline;
  font-family: var(--serif); font-size: 17px; color: #b5a487; }
.pa-phases li[data-status="running"] { color: #4c443b; }
.pa-phases li[data-status="done"] { color: #6d5a3a; }
.pa-phases li[data-status="failed"] { color: #8a5a2e; }
.pa-phases li em { grid-column: 2; font-family: var(--sans); font-style: normal; font-size: 12px; color: #97876e; }
.pa-mark { font-family: var(--sans); font-size: 13px; color: #a3762f; }
.pa-phases li[data-status="running"] .pa-mark { animation: pa-pulse 1.4s ease-in-out infinite; }
@keyframes pa-pulse { 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .pa-phases li .pa-mark { animation: none; } }

.pa-hero { padding-bottom: 18px; border-bottom: 1px solid rgba(163,118,47,.16); }
.pa-hero-line { margin-top: 10px; font-family: var(--serif); font-size: clamp(22px, 2.8vw, 30px);
  font-weight: 500; line-height: 1.35; color: #4c443b; }
.pa-hero-id { margin-top: 12px; font-size: 15px; color: #6d5a3a; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.pa-hero-basis { margin-top: 6px; font-size: 13px; color: #8a7f6c; }
.pa-freshness { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 6px; }
.pa-fresh { font-family: var(--sans); font-size: 12px; color: #6e6557; background: rgba(151,134,110,.1);
  padding: 4px 10px; border-radius: 999px; }
.pa-fresh.stale, .pa-fresh.failed { color: #8a5a2e; background: rgba(192,122,69,.12); }

.pa-pill { display: inline-block; font-family: var(--sans); font-size: 12px; letter-spacing: .06em;
  padding: 3px 9px; border-radius: 999px; background: rgba(151,134,110,.14); color: #6e6557; }
.pa-pill.s-strong { background: rgba(125,155,98,.2); color: #455a2f; }
.pa-pill.s-supported, .pa-pill.id { background: rgba(110,139,168,.16); color: #46617e; }
.pa-pill.s-emerging, .pa-pill.stage { background: rgba(196,160,92,.18); color: #7a5a1e; }
.pa-pill.s-limited, .pa-pill.muted { background: rgba(151,134,110,.12); color: #8a7f6c; }
.pa-pill.warn, .pa-pill.s-conflicting { background: rgba(192,122,69,.16); color: #8a5a2e; }
.pa-pill.cur { background: rgba(125,155,98,.16); color: #55663f; margin-left: 6px; }

.pa-sec { margin-top: 28px; }
.pa-sec > .pa-sec-k { margin-bottom: 10px; }
.pa-role, .pa-built, .pa-cap, .pa-combo, .pa-ai, .pa-opp, .pa-mkt, .pa-under, .pa-conflict {
  padding: 14px 0; border-top: 1px solid rgba(163,118,47,.12); min-width: 0; }
.pa-role-t, .pa-built-t, .pa-cap-n, .pa-opp-t, .pa-mkt-t, .pa-cve-v {
  font-family: var(--serif); font-size: 18px; color: #4c443b; line-height: 1.35; }
.pa-role-t span { color: #8a795c; }
.pa-role-d, .pa-cap-d { margin-top: 4px; font-size: 13px; color: #8a7f6c; }
.pa-role-r { margin: 8px 0 0 18px; font-size: 14px; line-height: 1.6; color: #6d5a3a; }
.pa-exp-total { margin-top: 8px; font-family: var(--serif); font-size: 18px; color: #4c443b; }
.pa-exp-p { margin-top: 6px; font-size: 14px; color: #6d5a3a; }
.pa-built p, .pa-opp p, .pa-mkt p, .pa-combo p, .pa-under p, .pa-conflict p { margin-top: 6px; font-size: 14px; line-height: 1.6; color: #6d5a3a; }
.pa-built em { font-family: var(--sans); font-style: normal; font-size: 11.5px; letter-spacing: .16em;
  text-transform: uppercase; color: #a3987f; margin-right: 6px; }
.pa-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.pa-built-ev a, .pa-drawer a { color: #a3762f; }
.pa-ev { margin-top: 6px; background: none; border: 0; padding: 0; cursor: pointer; font-family: var(--sans);
  font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: #a3762f; }
.pa-ev:focus-visible { outline: 2px solid rgba(196,160,92,.8); outline-offset: 3px; }

/* the signature view: what you say, beside what we found */
.pa-cve { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) auto; gap: 16px;
  padding: 16px 0; border-top: 1px solid rgba(163,118,47,.12); align-items: start; }
.pa-cve-found ul { margin: 6px 0 0 18px; font-size: 14px; line-height: 1.6; color: #6d5a3a; }
.pa-cve-str { display: grid; gap: 6px; justify-items: start; }
.pa-agree { margin-top: 6px; font-size: 14px; color: #55663f; }
.pa-missing { margin-top: 6px; font-size: 14px; color: #6e6557; }
.pa-conflict-v { display: flex; flex-wrap: wrap; gap: 6px 14px; }
.pa-conflict-v span { font-size: 13px; color: #8a5a2e; }
.pa-ai-m { margin-top: 8px; font-size: 14px; line-height: 1.6; color: #6d5a3a; }
.pa-ai-m span { display: block; font-size: 12.5px; color: #8a7f6c; }
.pa-route { margin-top: 8px; font-size: 14px; color: #6d5a3a; }
.pa-mkt-s, .pa-out { margin-top: 8px; font-size: 14px; line-height: 1.6; color: #6d5a3a; }
.pa-out.muted { color: #8a7f6c; }
.pa-foot { margin-top: 32px; padding-top: 18px; border-top: 1px solid rgba(163,118,47,.16); }

.pa-drawer-back { position: fixed; inset: 0; z-index: 160; background: rgba(60,55,51,.28);
  display: flex; justify-content: flex-end; }
.pa-drawer { width: min(460px, 100%); height: 100%; overflow-y: auto; padding: 26px 24px;
  background: #fdf8ec; box-shadow: -12px 0 40px rgba(60,55,51,.18); position: relative; }
.pa-drawer-x { position: absolute; top: 14px; right: 14px; background: none; border: 0; font-size: 18px;
  color: #8a7f6c; cursor: pointer; }
.pa-drawer-item { margin-top: 18px; }
.pa-drawer-src { font-family: var(--sans); font-size: 12px; letter-spacing: .08em; color: #8a795c; }
.pa-drawer-subject { margin-top: 6px; font-family: var(--serif); font-size: 26px; font-weight: 500; line-height: 1.15; color: #3b332a; }
.pa-drawer-why { color: #99702f; }
.pa-drawer blockquote { margin: 8px 0; padding-left: 12px; border-left: 2px solid rgba(196,160,92,.5);
  font-family: var(--serif); font-size: 16px; line-height: 1.5; color: #4c443b; }

@media (max-width: 680px) {
  .pa-cve { grid-template-columns: 1fr; gap: 8px; }
}

/* ================= PROFESSIONAL AUDIT · the diagnostic =================
   Editorial, not a dashboard: a serif question beside one large score, then
   full-width analytical sections ruled with hairlines. Cards only where a
   source or an insight earns one. Type comes from a small set of tokens. */

.ws-detail.ws-detail-wide { max-width: 1280px; }

.pa.pa-v2 {
  --pa-ink: #3b332a; --pa-ink-2: #5c4e3d; --pa-ink-3: #80735f; --pa-ink-4: #a2957c;
  --pa-gold: #99702f; --pa-accent: #c2672c; --pa-good: #5b7042;
  --pa-rule: rgba(153,112,47,.22); --pa-rule-soft: rgba(153,112,47,.12);
  --pa-paper: #fffaf1;
  --pa-display: 34px; --pa-h2: 30px; --pa-h3: 22px; --pa-name: 24px;
  --pa-body: 17px; --pa-small: 15px; --pa-meta: 13.5px; --pa-eyebrow: 12px;
  max-width: none; margin: 0; text-align: left;
  font-family: var(--sans); font-size: var(--pa-body); line-height: 1.55; color: var(--pa-ink);
}
@media (min-width: 700px) {
  .pa.pa-v2 { --pa-display: 44px; --pa-h2: 33px; --pa-name: 25px; --pa-body: 17.5px; }
}
@media (min-width: 1024px) {
  .pa.pa-v2 { --pa-display: 60px; --pa-h2: 38px; --pa-h3: 24px; --pa-name: 27px; --pa-body: 18px; }
}

.pa-v2 .pa-eyebrow { display: block; font-family: var(--sans); font-size: var(--pa-eyebrow); font-weight: 500;
  letter-spacing: .2em; text-transform: uppercase; color: var(--pa-gold); }
.pa-v2 .pa-note { font-size: var(--pa-meta); line-height: 1.5; color: var(--pa-ink-3); }
.pa-v2 .pa-note.stale { color: var(--pa-accent); }
.pa-v2 .pa-idx { font-family: var(--serif); font-size: 20px; line-height: 1; color: var(--pa-gold); }

/* ---- hero ---- */
.pa-v2 .pa-top { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr);
  gap: clamp(28px, 4.5vw, 72px); align-items: end; padding-bottom: 34px; border-bottom: 1px solid var(--pa-rule); }
.pa-v2 .pa-top-legacy { grid-template-columns: minmax(0, 1fr); }
.pa-v2 .pa-display { margin-top: 14px; font-family: var(--serif); font-weight: 500; font-size: var(--pa-display);
  line-height: 1.02; letter-spacing: -.012em; color: var(--pa-ink); text-wrap: balance; }
.pa-v2 .pa-interp { margin-top: 20px; max-width: 34em; font-size: calc(var(--pa-body) + 1px); line-height: 1.6;
  color: var(--pa-ink-2); }
.pa-v2 .pa-prov { margin-top: 14px; font-size: var(--pa-meta); color: var(--pa-ink-3); }
.pa-v2 .pa-cta { margin-top: 22px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; }
.pa-v2 .pa-cta-note { max-width: 30em; font-size: var(--pa-meta); color: var(--pa-ink-3); }
.pa-v2 a.pa-report { text-decoration: none; }

.pa-v2 .pa-scorecard { justify-self: end; width: 100%; max-width: 340px; padding: 28px 30px 24px;
  border: 1px solid var(--pa-rule); border-radius: 22px; background: linear-gradient(180deg, #fffdf8 0%, #faf1df 100%); }
.pa-v2 .pa-score { display: flex; align-items: baseline; gap: 6px; padding: 0; border: 0; background: none;
  font: inherit; color: var(--pa-ink); cursor: pointer; }
.pa-v2 .pa-score:focus-visible, .pa-v2 .pa-howlink:focus-visible, .pa-v2 summary:focus-visible, .pa-v2 .pa-ev:focus-visible,
.pa-v2 .pa-act-pick input:focus-visible + span {
  outline: 2px solid rgba(194,103,44,.55); outline-offset: 4px; border-radius: 6px; }
.pa-v2 .pa-score-n { font-family: var(--serif); font-weight: 500; font-size: clamp(88px, 9.5vw, 124px);
  line-height: .86; letter-spacing: -.03em; }
.pa-v2 .pa-score-of { font-family: var(--serif); font-size: 28px; color: var(--pa-ink-4); }
.pa-v2 .pa-score-empty { font-family: var(--serif); font-size: 30px; line-height: 1.12; color: var(--pa-ink-2); }
.pa-v2 .pa-score-k { margin-top: 14px; font-size: var(--pa-eyebrow); font-weight: 500; letter-spacing: .2em;
  text-transform: uppercase; color: var(--pa-gold); }
.pa-v2 .pa-score-band { margin-top: 3px; font-family: var(--serif); font-size: 22px; line-height: 1.25; color: var(--pa-ink-2); }
.pa-v2 .pa-conf { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--pa-rule-soft);
  display: flex; align-items: center; gap: 9px; font-size: 15px; font-weight: 500; color: var(--pa-ink-2); }
.pa-v2 .pa-conf-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--pa-ink-4);
  box-shadow: 0 0 0 3px rgba(162,149,124,.18); }
.pa-v2 .pa-conf-dot[data-level="high"] { background: var(--pa-good); box-shadow: 0 0 0 3px rgba(91,112,66,.16); }
.pa-v2 .pa-conf-dot[data-level="moderate"] { background: #b98d45; box-shadow: 0 0 0 3px rgba(185,141,69,.18); }
.pa-v2 .pa-conf-dot[data-level="low"] { background: var(--pa-accent); box-shadow: 0 0 0 3px rgba(194,103,44,.15); }
.pa-v2 .pa-conf-sub { margin-top: 3px; font-size: var(--pa-meta); color: var(--pa-ink-3); }
.pa-v2 .pa-howlink { margin-top: 12px; padding: 0; border: 0; background: none; cursor: pointer;
  font-family: var(--sans); font-size: 12.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--pa-accent); }

.pa-v2 .pa-why { margin-top: 18px; padding: 22px 26px; border-radius: 16px; border: 1px solid var(--pa-rule-soft);
  background: rgba(153,112,47,.055); }
.pa-v2 .pa-why-t { max-width: 46em; font-size: var(--pa-body); line-height: 1.6; color: var(--pa-ink-2); }
.pa-v2 .pa-why-un { margin: 12px 0 0; padding-left: 18px; max-width: 50em; font-size: var(--pa-small); line-height: 1.55; color: var(--pa-ink-3); }
.pa-v2 .pa-why-un strong { font-weight: 500; color: var(--pa-ink-2); }
.pa-v2 .pa-why-m { margin-top: 12px; font-size: var(--pa-meta); color: var(--pa-ink-4); }

/* ---- combined score ---- */
.pa-v2 .pa-drivers { margin-top: 40px; }
.pa-v2 .pa-sec2-h { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 24px; margin-bottom: 18px; }
.pa-v2 .pa-drivers-h .pa-howlink { margin-top: 0; flex: none; }
.pa-v2 .pa-dims { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--pa-rule); }
.pa-v2 .pa-dim { border-bottom: 1px solid var(--pa-rule-soft); }
.pa-v2 .pa-dim summary { list-style: none; cursor: pointer; display: grid; align-items: center; gap: 24px;
  grid-template-columns: minmax(170px, 1fr) minmax(140px, 2.4fr) 52px minmax(190px, 1.1fr); padding: 15px 2px; }
.pa-v2 summary::-webkit-details-marker { display: none; }
.pa-v2 .pa-dim-l, .pa-v2 .pa-sub-l { font-size: 13px; font-weight: 500; letter-spacing: .15em; text-transform: uppercase; color: var(--pa-ink-2); }
.pa-v2 .pa-bar { height: 6px; border-radius: 99px; background: rgba(153,112,47,.12); overflow: hidden; }
.pa-v2 .pa-bar i { display: block; height: 100%; border-radius: inherit; background: #b98d45; }
.pa-v2 [data-band="high"] .pa-bar i { background: #8a6727; }
.pa-v2 [data-band="low"] .pa-bar i { background: var(--pa-accent); opacity: .8; }
.pa-v2 .is-unscored .pa-bar, .pa-v2 [data-band="none"] .pa-bar { background: repeating-linear-gradient(90deg, rgba(153,112,47,.2) 0 5px, transparent 5px 10px); }
.pa-v2 .pa-dim-s { font-family: var(--serif); font-size: 30px; font-weight: 500; line-height: 1; text-align: right; color: var(--pa-ink); }
.pa-v2 .pa-dim-c { font-size: var(--pa-meta); line-height: 1.35; color: var(--pa-ink-2); }
.pa-v2 .pa-dim-c span { display: block; }
.pa-v2 .pa-dim-c span + span { color: var(--pa-ink-4); }
.pa-v2 .pa-dim.is-unscored .pa-dim-l, .pa-v2 .pa-dim.is-unscored .pa-dim-c { color: var(--pa-ink-4); }
.pa-v2 .pa-dim-line { padding: 0 2px 16px; max-width: 50em; font-size: var(--pa-small); line-height: 1.6; color: var(--pa-ink-2); }

/* ---- sections ---- */
.pa-v2 .pa-sec2 { margin-top: clamp(56px, 7vw, 92px); }
.pa-v2 .pa-h2 { margin-top: 10px; font-family: var(--serif); font-weight: 500; font-size: var(--pa-h2);
  line-height: 1.1; color: var(--pa-ink); text-wrap: balance; }
.pa-v2 .pa-lead2 { margin-top: 10px; max-width: 44em; font-size: var(--pa-small); line-height: 1.6; color: var(--pa-ink-3); }

.pa-v2 .pa-srcs { display: inline-flex; flex-wrap: wrap; gap: 3px 12px; }
.pa-v2 .pa-srcmark { position: relative; padding-left: 11px; font-size: 11.5px; font-weight: 500; letter-spacing: .1em;
  text-transform: uppercase; color: var(--pa-ink-3); white-space: nowrap; }
.pa-v2 .pa-srcmark::before { content: ""; position: absolute; left: 0; top: 50%; width: 6px; height: 6px;
  margin-top: -3px; border-radius: 50%; background: var(--pa-mark, #a2957c); }
.pa-v2 .pa-srcmark[data-src="RESUME"] { --pa-mark: #a67a34; }
.pa-v2 .pa-srcmark[data-src="LINKEDIN"] { --pa-mark: #50708f; }
.pa-v2 .pa-srcmark[data-src="PORTFOLIO"] { --pa-mark: #c2672c; }
.pa-v2 .pa-srcmark[data-src="GITHUB"] { --pa-mark: #5d5a50; }
.pa-v2 .pa-srcmark[data-src="MARKET"] { --pa-mark: #7c9a6a; }

.pa-v2 .pa-chev { justify-self: end; width: 9px; height: 9px; margin: -4px 4px 0 0; transform-origin: 50% 50%;
  border-right: 1.5px solid var(--pa-ink-4); border-bottom: 1.5px solid var(--pa-ink-4);
  transform: rotate(45deg); transition: transform .22s ease; }
.pa-v2 details[open] > summary .pa-chev { margin-top: 4px; transform: rotate(225deg); }

.pa-v2 .pa-ev { margin-top: 0; padding: 0; border: 0; background: none; cursor: pointer; font-family: var(--sans);
  font-size: 12px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--pa-accent); }
.pa-v2 .pa-ev:hover { text-decoration: underline; text-underline-offset: 3px; }
.pa-v2 .pa-foot-row { margin-top: 10px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; }

/* ---- what is strong ---- */
.pa-v2 .pa-strong { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 48px; border-top: 1px solid var(--pa-rule); }
.pa-v2 .pa-strong-i { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 12px; padding: 22px 2px;
  border-bottom: 1px solid var(--pa-rule-soft); }
.pa-v2 .pa-strong-t { font-family: var(--serif); font-weight: 500; font-size: var(--pa-name); line-height: 1.15; color: var(--pa-ink); }
.pa-v2 .pa-strong-w { margin-top: 8px; font-size: var(--pa-small); line-height: 1.58; color: var(--pa-ink-2); }

/* ---- sources ---- */
.pa-v2 .pa-src2 { margin-top: 18px; padding: 28px 30px 26px; border-radius: 22px; border: 1px solid var(--pa-rule);
  background: var(--pa-paper); }
.pa-v2 .pa-src2.is-not_added, .pa-v2 .pa-src2.is-not_applicable { background: transparent; border-style: dashed; padding: 22px 30px; }
.pa-v2 .pa-src2-h { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; }
.pa-v2 .pa-src2-purpose { margin-top: 8px; font-family: var(--serif); font-weight: 500; font-size: var(--pa-h3); line-height: 1.2; color: var(--pa-ink); }
.pa-v2 .pa-src2-score { flex: none; display: flex; align-items: baseline; gap: 4px; }
.pa-v2 .pa-src2-n { font-family: var(--serif); font-weight: 500; font-size: clamp(48px, 5vw, 72px); line-height: .9; color: var(--pa-ink); }
.pa-v2 .pa-src2-of { font-family: var(--serif); font-size: 20px; color: var(--pa-ink-4); }
.pa-v2 .pa-src2-status { font-family: var(--serif); font-size: 21px; line-height: 1.2; color: var(--pa-ink-3); text-align: right; max-width: 12em; }
.pa-v2 .pa-src2-line { margin-top: 14px; max-width: 40em; font-size: var(--pa-body); line-height: 1.55; color: var(--pa-ink-2); }
.pa-v2 .pa-subs { list-style: none; margin: 18px 0 0; padding: 0; border-top: 1px solid var(--pa-rule-soft); }
.pa-v2 .pa-sub { display: grid; grid-template-columns: minmax(150px, .9fr) minmax(90px, 1.2fr) 44px minmax(200px, 2fr); gap: 20px;
  align-items: center; padding: 10px 0; border-bottom: 1px solid var(--pa-rule-soft); }
.pa-v2 .pa-sub-l { font-size: 12px; }
.pa-v2 .pa-sub-s { font-family: var(--serif); font-size: 22px; line-height: 1; text-align: right; color: var(--pa-ink); }
.pa-v2 .pa-sub-s em { font-family: var(--sans); font-style: normal; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--pa-ink-4); }
.pa-v2 .pa-sub-line { font-size: var(--pa-meta); line-height: 1.45; color: var(--pa-ink-3); }
.pa-v2 .pa-src2-cols { margin-top: 22px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 40px; }
.pa-v2 .pa-find { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 12px; }
.pa-v2 .pa-find li { position: relative; padding-left: 16px; }
.pa-v2 .pa-find li::before { content: ""; position: absolute; left: 0; top: .62em; width: 7px; height: 1.5px; background: var(--pa-good); }
.pa-v2 .pa-find.gap li::before { background: var(--pa-accent); }
.pa-v2 .pa-find-t { font-size: var(--pa-small); font-weight: 500; color: var(--pa-ink); }
.pa-v2 .pa-find-l { margin-top: 2px; font-size: 14.5px; line-height: 1.5; color: var(--pa-ink-3); }
.pa-v2 .pa-find .pa-ev { margin-top: 4px; }
.pa-v2 .pa-src2-next { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--pa-rule-soft); }
.pa-v2 .pa-src2-next ol { margin: 10px 0 0; padding-left: 22px; display: grid; gap: 10px; }
.pa-v2 .pa-src2-next li::marker { font-family: var(--serif); color: var(--pa-gold); }
.pa-v2 .pa-themes { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--pa-rule-soft); }
.pa-v2 .pa-themes ul { list-style: none; margin: 10px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px 28px; }
.pa-v2 .pa-theme-t { font-size: var(--pa-small); font-weight: 500; color: var(--pa-ink); }
.pa-v2 .pa-src2-window { margin-top: 14px; }

/* ---- holding you back ---- */
.pa-v2 .pa-weak { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--pa-rule); }
.pa-v2 .pa-weak-i { display: grid; grid-template-columns: 120px minmax(0, 1fr) minmax(180px, .6fr); gap: 20px 28px;
  padding: 22px 2px; border-bottom: 1px solid var(--pa-rule-soft); }
.pa-v2 .pa-weak-rank { display: grid; gap: 8px; align-content: start; }
.pa-v2 .pa-level-tag { font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--pa-ink-4); }
.pa-v2 .pa-weak-i[data-level="high"] .pa-level-tag { color: var(--pa-accent); }
.pa-v2 .pa-weak-t { font-family: var(--serif); font-weight: 500; font-size: var(--pa-name); line-height: 1.15; color: var(--pa-ink); }
.pa-v2 .pa-weak-x { margin-top: 8px; max-width: 44em; font-size: var(--pa-small); line-height: 1.6; color: var(--pa-ink-2); }
.pa-v2 .pa-weak-main .pa-ev { margin-top: 8px; }
.pa-v2 .pa-weak-side { text-align: right; }
.pa-v2 .pa-weak-imp { font-family: var(--serif); font-size: 26px; line-height: 1; color: var(--pa-ink); }

/* ---- actions + simulator ---- */
.pa-v2 .pa-sim-wrap { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(280px, 1fr); gap: 32px 40px; align-items: start; }
.pa-v2 .pa-acts { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--pa-rule); }
.pa-v2 .pa-act { display: grid; grid-template-columns: 28px minmax(0, 1fr) minmax(150px, .5fr); gap: 16px 22px;
  padding: 22px 2px; border-bottom: 1px solid var(--pa-rule-soft); transition: opacity .2s ease; }
.pa-v2 .pa-act.is-off { opacity: .42; }
.pa-v2 .pa-act-pick { display: block; margin-top: 4px; cursor: pointer; }
.pa-v2 .pa-act-pick input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pa-v2 .pa-act-pick span { display: block; width: 20px; height: 20px; border-radius: 6px; border: 1.5px solid var(--pa-ink-4); background: var(--pa-paper); }
.pa-v2 .pa-act-pick input:checked + span { border-color: var(--pa-accent); background: var(--pa-accent);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path d='M5 10.5l3.2 3L15 7' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>"); }
.pa-v2 .pa-act-t { margin-top: 6px; font-family: var(--serif); font-weight: 500; font-size: var(--pa-name); line-height: 1.15; color: var(--pa-ink); }
.pa-v2 .pa-act-why { margin-top: 8px; font-size: var(--pa-small); line-height: 1.55; color: var(--pa-ink-2); }
.pa-v2 .pa-act-why span { margin-right: 10px; font-size: 11px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--pa-ink-4); }
.pa-v2 .pa-act-side { text-align: right; }
.pa-v2 .pa-act-imp { font-family: var(--serif); font-size: 26px; line-height: 1; color: var(--pa-ink); }
.pa-v2 .pa-act-chain { margin-top: 8px; }
.pa-v2 .pa-sim { position: sticky; top: 24px; padding: 26px 28px; border-radius: 22px; border: 1px solid var(--pa-rule);
  background: linear-gradient(180deg, #fffdf8 0%, #faf1df 100%); }
.pa-v2 .pa-sim-nums { margin-top: 14px; display: flex; align-items: flex-end; gap: 18px; }
.pa-v2 .pa-sim-k { display: block; font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--pa-ink-4); }
.pa-v2 .pa-sim-n { display: block; margin-top: 4px; font-family: var(--serif); font-weight: 500; font-size: 54px; line-height: .9; color: var(--pa-ink); }
.pa-v2 .pa-sim-est { color: var(--pa-accent); }
.pa-v2 .pa-sim-arrow { padding-bottom: 8px; font-size: 22px; color: var(--pa-ink-4); }
.pa-v2 .pa-sim-tag { margin-top: 14px; font-size: 12px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--pa-accent); }
.pa-v2 .pa-sim-why { margin: 12px 0 0; padding-left: 18px; font-size: var(--pa-meta); line-height: 1.5; color: var(--pa-ink-3); }

/* ---- roles ---- */
.pa-v2 .pa-roles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.pa-v2 .pa-role2 { padding: 24px 26px; border-radius: 20px; border: 1px solid var(--pa-rule); background: var(--pa-paper); }
.pa-v2 .pa-role2-h { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; }
.pa-v2 .pa-role2-t { font-family: var(--serif); font-weight: 500; font-size: var(--pa-name); line-height: 1.15; color: var(--pa-ink); overflow-wrap: anywhere; }
.pa-v2 .pa-fit { flex: none; font-size: 12px; font-weight: 500; letter-spacing: .13em; text-transform: uppercase; color: var(--pa-gold); text-align: right; max-width: 12em; }
.pa-v2 .pa-role2[data-fit="strong"] .pa-fit { color: var(--pa-good); }
.pa-v2 .pa-role2[data-fit="stretch"] .pa-fit, .pa-v2 .pa-role2[data-fit="open"] .pa-fit { color: var(--pa-ink-4); }
.pa-v2 .pa-role2-l { margin-top: 10px; font-size: var(--pa-small); line-height: 1.55; color: var(--pa-ink-2); }
.pa-v2 .pa-role2-cols { margin-top: 16px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 22px; }
.pa-v2 .pa-role2-list { margin-top: 6px; font-size: 14.5px; line-height: 1.5; color: var(--pa-ink-2); }
.pa-v2 .pa-role2 .pa-ev { margin-top: 14px; }

/* ---- coverage ---- */
.pa-v2 .pa-cov { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--pa-rule); }
.pa-v2 .pa-cov li { display: grid; grid-template-columns: 120px 230px minmax(0, 1fr) auto; gap: 18px; align-items: baseline;
  padding: 13px 2px; border-bottom: 1px solid var(--pa-rule-soft); font-size: var(--pa-small); }
.pa-v2 .pa-cov-n { font-weight: 500; color: var(--pa-ink); }
.pa-v2 .pa-cov-l { display: inline-flex; align-items: center; gap: 9px; color: var(--pa-ink-2); }
.pa-v2 .pa-cov-l i { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--pa-ink-4); }
.pa-v2 .pa-cov li[data-level="strong"] .pa-cov-l i { background: var(--pa-good); }
.pa-v2 .pa-cov li[data-level="supporting"] .pa-cov-l i { background: #b98d45; }
.pa-v2 .pa-cov li[data-level="light"] .pa-cov-l i { background: #d4c29c; }
.pa-v2 .pa-cov li[data-level="failed"] .pa-cov-l i { background: var(--pa-accent); }
.pa-v2 .pa-cov li[data-level="not_added"] .pa-cov-l i { background: transparent; box-shadow: inset 0 0 0 1.5px var(--pa-ink-4); }
.pa-v2 .pa-cov li[data-level="not_added"], .pa-v2 .pa-cov li[data-level="not_added"] .pa-cov-n, .pa-v2 .pa-cov li[data-level="not_added"] .pa-cov-l { color: var(--pa-ink-4); }
.pa-v2 .pa-cov-d { color: var(--pa-ink-3); }
.pa-v2 .pa-cov-f { font-size: 13px; color: var(--pa-ink-4); text-align: right; white-space: nowrap; }
.pa-v2 .pa-cov-tot { margin-top: 14px; font-size: var(--pa-meta); color: var(--pa-ink-3); }

/* ---- report CTA ---- */
.pa-v2 .pa-report-cta { margin-top: clamp(56px, 7vw, 92px); padding: 30px 34px; border-radius: 22px; background: #3b332a; color: #f4ead8;
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 40px; align-items: center; }
.pa-v2 .pa-report-cta .pa-eyebrow { color: #e0b26c; }
.pa-v2 .pa-report-cta .pa-h2 { color: #fff7ea; }
.pa-v2 .pa-report-cta .pa-lead2 { color: #d9cbb4; }

/* ---- the full record ---- */
.pa-v2 .pa-record { margin-top: clamp(48px, 6vw, 72px); border-top: 1px solid var(--pa-rule); border-bottom: 1px solid var(--pa-rule); }
.pa-v2 .pa-record > summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: minmax(0, 1fr) 20px;
  align-items: center; gap: 16px; padding: 20px 2px; }
.pa-v2 .pa-record-sub { display: block; margin-top: 6px; font-size: var(--pa-small); color: var(--pa-ink-3); }
.pa-v2 .pa-record-body { max-width: 820px; padding-bottom: 28px; }
.pa-v2 .pa-record-body .pa-sec:first-child { margin-top: 4px; }
.pa-v2 .pa-foot { margin-top: 36px; }

/* ---- motion: one entrance, then stillness ---- */
@keyframes pa-rise { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.pa-v2 .pa-reveal { animation: pa-rise .6s cubic-bezier(.2, .7, .2, 1) both; animation-delay: calc(var(--i, 0) * 70ms); }
.pa-v2 .pa-score-n { display: inline-block; animation: pa-rise .8s .12s cubic-bezier(.2, .7, .2, 1) both; }
@media (prefers-reduced-motion: reduce) {
  .pa-v2 .pa-reveal, .pa-v2 .pa-score-n { animation: none; }
  .pa-v2 .pa-chev, .pa-v2 .pa-act { transition: none; }
}

/* ---- tablet ---- */
@media (max-width: 960px) {
  .pa-v2 .pa-top { grid-template-columns: minmax(0, 1fr); align-items: start; gap: 24px; }
  .pa-v2 .pa-scorecard { order: -1; justify-self: stretch; max-width: none; display: grid;
    grid-template-columns: auto minmax(0, 1fr); column-gap: 26px; align-items: end; }
  .pa-v2 .pa-scorecard > .pa-score, .pa-v2 .pa-scorecard > .pa-score-empty { grid-row: 1 / span 2; }
  .pa-v2 .pa-scorecard > .pa-score-k { margin-top: 0; }
  .pa-v2 .pa-scorecard > .pa-conf, .pa-v2 .pa-scorecard > .pa-conf-sub, .pa-v2 .pa-scorecard > .pa-howlink { grid-column: 1 / -1; }
  .pa-v2 .pa-strong { grid-template-columns: minmax(0, 1fr); }
  .pa-v2 .pa-sim-wrap { grid-template-columns: minmax(0, 1fr); }
  .pa-v2 .pa-sim { position: static; }
  .pa-v2 .pa-roles { grid-template-columns: minmax(0, 1fr); }
  .pa-v2 .pa-weak-i { grid-template-columns: 96px minmax(0, 1fr); }
  .pa-v2 .pa-weak-side { grid-column: 2; text-align: left; }
  .pa-v2 .pa-cov li { grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; }
  .pa-v2 .pa-cov-d, .pa-v2 .pa-cov-f { grid-column: 1 / -1; text-align: left; white-space: normal; }
  .pa-v2 .pa-dim summary { grid-template-columns: minmax(130px, 1fr) minmax(90px, 1.6fr) 44px; }
  .pa-v2 .pa-dim-c { grid-column: 1 / -1; margin-top: -8px; }
  .pa-v2 .pa-dim-c span { display: inline; }
  .pa-v2 .pa-dim-c span + span::before { content: " · "; }
  .pa-v2 .pa-sub { grid-template-columns: minmax(120px, 1fr) minmax(80px, 1.4fr) 40px; }
  .pa-v2 .pa-sub-line { grid-column: 1 / -1; margin-top: -4px; }
  .pa-v2 .pa-report-cta { grid-template-columns: minmax(0, 1fr); }
}

/* ---- phone: score first, summary, strong points, sources, actions, roles ---- */
@media (max-width: 600px) {
  .pa-v2 .pa-scorecard { padding: 20px; column-gap: 18px; }
  .pa-v2 .pa-score-n { font-size: 78px; }
  .pa-v2 .pa-interp { margin-top: 14px; }
  .pa-v2 .pa-dim summary { grid-template-columns: minmax(0, 1fr) auto; gap: 8px 14px; padding: 14px 2px; }
  .pa-v2 .pa-bar { grid-column: 1 / -1; grid-row: 2; }
  .pa-v2 .pa-dim-s { grid-column: 2; grid-row: 1; font-size: 24px; }
  .pa-v2 .pa-dim-c { grid-column: 1 / -1; grid-row: 3; margin-top: 0; }
  .pa-v2 .pa-src2 { padding: 22px 20px; border-radius: 18px; }
  .pa-v2 .pa-src2-h { flex-direction: column; gap: 10px; }
  .pa-v2 .pa-src2-status { text-align: left; }
  .pa-v2 .pa-sub { grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; }
  .pa-v2 .pa-sub .pa-bar { grid-column: 1 / -1; }
  .pa-v2 .pa-src2-cols { grid-template-columns: minmax(0, 1fr); }
  .pa-v2 .pa-strong-i { grid-template-columns: 32px minmax(0, 1fr); }
  .pa-v2 .pa-weak-i { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .pa-v2 .pa-weak-rank { grid-auto-flow: column; justify-content: start; align-items: baseline; gap: 12px; }
  .pa-v2 .pa-weak-side { grid-column: 1; }
  .pa-v2 .pa-act { grid-template-columns: 24px minmax(0, 1fr); }
  .pa-v2 .pa-act-side { grid-column: 2; text-align: left; }
  .pa-v2 .pa-role2 { padding: 20px; }
  .pa-v2 .pa-role2-cols { grid-template-columns: minmax(0, 1fr); }
  .pa-v2 .pa-sec2-h { flex-direction: column; align-items: flex-start; gap: 8px; }
  .pa-v2 .pa-report-cta { padding: 24px 22px; }
}

/* ---- Chapter III: optional sources, said once and positively ---- */
.ev-optional { margin-left: 8px; font-family: var(--sans); font-size: 12px; letter-spacing: .16em; text-transform: uppercase;
  color: #7d8a55; vertical-align: 3px; }
.ev-opt-choice { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; }
.ev-add { padding: 9px 18px; border: 1px solid rgba(178, 146, 94, .55); border-radius: 999px; background: rgba(253, 248, 236, .6);
  font-family: var(--sans); font-size: 13px; color: #6d5a3a; cursor: pointer; }
.ev-add:hover, .ev-add:focus-visible { border-color: rgba(216, 150, 80, .85); color: var(--orange); }
.ev-skipone, .ev-undo, .dx-link { padding: 4px 2px; background: none; border: 0; cursor: pointer; font-family: var(--sans);
  font-size: 13px; color: #8d6a2b; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(141, 106, 43, .35); }
.ev-skipone:hover, .ev-undo:hover, .dx-link:hover { color: var(--orange); }
.ev-opt-field { width: 100%; }
.ev-skipped { font-size: 13.5px; line-height: 1.45; color: #9b8d78; }
.ev-hint { width: 100%; margin: 0; font-size: 13px; line-height: 1.45; color: #6f7b4c; }
.ev-own { margin-top: 18px; }
@media (max-width: 560px) {
  .ev-row { grid-template-columns: 1fr; }
}

/* ---- audit: professional strength vs evidence coverage ---- */
.pa-ec { margin: 28px 0 8px; padding: 22px 24px; border: 1px solid rgba(178, 146, 94, .32); border-radius: 14px;
  background: rgba(253, 248, 236, .55); }
.pa-ec-line { margin-top: 6px; font-family: var(--serif); font-size: 18px; line-height: 1.4; color: #5a4f43; }
.pa-ec-line:first-letter { text-transform: uppercase; }
.pa-ec-flags { list-style: none; margin: 18px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; }
.pa-ec-flag { padding: 14px 16px; border-radius: 10px; background: rgba(255, 252, 245, .8); border: 1px solid rgba(178, 146, 94, .22); }
.pa-ec-k { font-family: var(--sans); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: #a08a5e; }
.pa-ec-s { margin-top: 4px; font-family: var(--serif); font-size: 19px; color: #5a4f43; }
.pa-ec-flag[data-state="strong"] .pa-ec-s { color: #5d6f3a; }
.pa-ec-flag[data-state="limited"] .pa-ec-s, .pa-ec-flag[data-state="needs_strengthening"] .pa-ec-s,
.pa-ec-flag[data-state="needs_attention"] .pa-ec-s { color: #8a5a2e; }
.pa-ec-l { margin-top: 6px; font-size: 14px; line-height: 1.5; color: #6e655b; }
.pa-ec-a { margin-top: 8px; font-size: 14px; line-height: 1.5; color: #5a4f43; }
.pa-ec-a span { display: block; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: #a08a5e; }

/* ---- welcome back ---- */
.dx-welcome { text-align: center; }
.dx-welcome-where { margin: 10px 0 4px; font-family: var(--sans); font-size: 13px; color: #8a795c; }
.dx-welcome .dx-commit { margin-top: 18px; }
.dx-welcome .dx-skip { display: block; margin: 14px auto 0; }
.dx-welcome-others { margin-top: 18px; font-size: 13.5px; color: #7a6c58; }
.dx-welcome-others summary { cursor: pointer; }
.dx-welcome-others ul { list-style: none; margin: 8px 0 0; padding: 0; }
.dx-welcome-audit { display: block; margin: 14px auto 0; }


/* ---- Elevate Myself ----
   Distinct from the audit's analytical instrument: warm ivory, muted gold,
   a soft coral accent, one large serif hero, a thin strip of strengths and
   a few generous opportunities separated by hairlines — no card grid. */
@keyframes emIn { to { opacity: 1; transform: translateY(0); } }
.ws-em { --em-ivory: #fbf5ea; --em-gold: #a8864a; --em-gold-soft: rgba(168, 134, 74, .22);
  --em-coral: #d9765b; --em-ink: #3b332b; --em-muted: #7a6e60; text-align: left; }
.ws-em-hero { padding: 8px 0 30px; border-bottom: 1px solid var(--em-gold-soft); }
.ws-em-eyebrow { font-family: var(--sans); font-size: 13px; letter-spacing: .28em; text-transform: uppercase; color: var(--em-gold); }
.ws-em-title { margin-top: 10px; font-family: var(--serif); font-weight: 500; font-size: clamp(42px, 5.6vw, 54px);
  line-height: 1.05; color: var(--em-ink); }
.ws-em-tag { margin-top: 10px; font-family: var(--serif); font-style: italic; font-size: clamp(18px, 2vw, 21px); color: #8a6b3d; }
.ws-em-line { margin-top: 22px; max-width: 34em; font-family: var(--sans); font-size: clamp(16px, 1.6vw, 18px); line-height: 1.6; color: var(--em-ink); }
.ws-em-framing { margin-top: 10px; max-width: 36em; font-family: var(--sans); font-size: 15px; line-height: 1.6; color: var(--em-muted); }
.ws-em-notice { margin-top: 18px; font-family: var(--sans); font-size: 15px; color: #5f6b45; }
.ws-em-empty { padding: 34px 0; }
.ws-em-empty-line { font-family: var(--serif); font-size: clamp(22px, 2.4vw, 26px); line-height: 1.35; color: var(--em-ink); max-width: 26em; }
.ws-em-empty-next { margin-top: 8px; font-family: var(--sans); font-size: 15px; color: var(--em-muted); }
.ws-em-sec { margin-top: 38px; }
.ws-em-h { font-family: var(--serif); font-weight: 500; font-size: clamp(28px, 3.2vw, 34px); line-height: 1.15; color: var(--em-ink); }
.ws-em-src { margin-top: 4px; font-family: var(--sans); font-size: 13px; letter-spacing: .04em; color: var(--em-muted); }

/* the strength strip: one line, hairline dividers, never cards */
.ws-em-have { list-style: none; margin: 16px 0 0; padding: 0; display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); border-top: 1px solid var(--em-gold-soft); }
.ws-em-have li { min-width: 0; padding: 16px 20px 16px 0; border-bottom: 1px solid var(--em-gold-soft); }
.ws-em-have-name { font-family: var(--serif); font-weight: 500; font-size: 22px; line-height: 1.2; color: var(--em-ink); }
.ws-em-have-line { margin-top: 4px; font-family: var(--sans); font-size: 14px; line-height: 1.5; color: #5d5347;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }

/* the opportunities */
.ws-em-opps { list-style: none; margin: 8px 0 0; padding: 0; }
.ws-em-opp { padding: 34px 0 30px; border-bottom: 1px solid var(--em-gold-soft); }
.ws-em-opp:last-child { border-bottom: 0; }
@media (prefers-reduced-motion: no-preference) {
  .ws-em-opp { opacity: 0; transform: translateY(8px); animation: emIn .6s cubic-bezier(.3,.6,.3,1) forwards; animation-delay: calc(var(--i, 0) * 90ms); }
}
.ws-em-progress { display: flex; flex-wrap: wrap; gap: 4px 18px; font-family: var(--sans); font-size: 13px; letter-spacing: .08em; color: #b3a58f; }
.ws-em-step { position: relative; padding-left: 14px; }
.ws-em-step::before { content: ""; position: absolute; left: 0; top: 50%; width: 7px; height: 7px; margin-top: -3.5px;
  border-radius: 50%; border: 1.5px solid #d6c7a8; }
.ws-em-step.is-past { color: var(--em-gold); }
.ws-em-step.is-past::before { background: var(--em-gold); border-color: var(--em-gold); }
.ws-em-step.is-now { color: var(--em-coral); font-weight: 500; }
.ws-em-step.is-now::before { background: var(--em-coral); border-color: var(--em-coral); }
.ws-em-name { margin-top: 14px; font-family: var(--serif); font-weight: 500; font-size: clamp(26px, 2.8vw, 30px); line-height: 1.15; color: var(--em-ink); }
.ws-em-for { margin-top: 4px; font-family: var(--sans); font-size: 14px; color: var(--em-muted); }
.ws-em-block { margin-top: 18px; max-width: 40em; }
.ws-em-k { font-family: var(--sans); font-weight: 500; font-size: 13px; letter-spacing: .18em; text-transform: uppercase; color: var(--em-gold); }
.ws-em-k.is-accent { color: var(--em-coral); }
.ws-em-k span { margin-left: 8px; font-weight: 400; letter-spacing: .04em; text-transform: none; color: var(--em-muted); }
.ws-em-body { margin-top: 5px; font-family: var(--sans); font-size: clamp(16px, 1.5vw, 17px); line-height: 1.6; color: #4a4037; }
.ws-em-try { margin-top: 20px; max-width: 40em; padding: 16px 20px; border-radius: 12px; background: var(--em-ivory);
  border-left: 3px solid var(--em-coral); }
.ws-em-try-text { margin-top: 6px; font-family: var(--serif); font-size: clamp(19px, 2vw, 21px); line-height: 1.45; color: var(--em-ink); }
.ws-em-optional { margin-top: 8px; font-family: var(--sans); font-size: 13px; color: var(--em-muted); }
.ws-em-done { margin-top: 14px; }
.ws-em-reported { font-family: var(--sans); font-size: 14px; color: #5f6b45; }
.ws-em-done-q { margin-top: 4px; font-family: var(--sans); font-size: 15px; color: var(--em-ink); }
.ws-em-done-q span { margin-left: 6px; font-size: 13px; color: var(--em-muted); }
.ws-em-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.ws-em-chip, .ws-em-did { min-height: 40px; padding: 8px 16px; border-radius: 40px; cursor: pointer;
  border: 1px solid rgba(168, 134, 74, .55); background: #fffdf8; font-family: var(--sans); font-size: 14px; color: var(--em-ink); }
.ws-em-chip:hover, .ws-em-did:hover { border-color: var(--em-coral); }
.ws-em-ground { margin-top: 20px; max-width: 40em; padding-top: 14px; border-top: 1px dashed var(--em-gold-soft); }
.ws-em-ground-btn { margin-top: 8px; min-height: 36px; padding: 0; background: none; border: 0; cursor: pointer;
  font-family: var(--sans); font-weight: 500; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--em-coral); }
.ws-em-ground-try { margin-top: 4px; font-family: var(--sans); font-size: 15.5px; line-height: 1.55; color: #4a4037; }
.ws-em-why { margin-top: 18px; max-width: 42em; font-family: var(--sans); }
.ws-em-why summary { cursor: pointer; min-height: 40px; display: inline-flex; align-items: center; font-size: 15px; color: #8a6b3d;
  text-decoration: underline; text-decoration-color: rgba(138, 107, 61, .35); text-underline-offset: 5px; }
.ws-em-why dl { margin: 8px 0 0; display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 10px 20px; }
.ws-em-why dt { font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--em-gold); padding-top: 2px; }
.ws-em-why dd { margin: 0; font-size: 15.5px; line-height: 1.55; color: #4a4037; overflow-wrap: anywhere; }
.ws-em-why dd > span, .ws-em-why li span { display: block; font-size: 13px; color: var(--em-muted); }
.ws-em-why ul { margin: 0; padding: 0; list-style: none; }
.ws-em-why li + li { margin-top: 6px; }
.ws-em-actions { margin-top: 18px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; }
.ws-em-act { min-height: 40px; padding: 0; background: none; border: 0; cursor: pointer; font-family: var(--sans); font-size: 14.5px;
  color: #5d5347; text-decoration: underline; text-decoration-color: rgba(93, 83, 71, .25); text-underline-offset: 5px; }
.ws-em-act.is-primary { padding: 9px 20px; border-radius: 40px; text-decoration: none; background: var(--em-coral); color: #fff; font-weight: 500; }
.ws-em-act[aria-pressed="true"] { color: var(--em-coral); font-weight: 500; text-decoration-color: var(--em-coral); }
.ws-em-act.is-primary[aria-pressed="true"] { background: #fff; color: var(--em-coral); box-shadow: inset 0 0 0 1.5px var(--em-coral); }
.ws-em-act:disabled { opacity: .6; cursor: default; }
.ws-em-note { min-height: 1.4em; margin-top: 6px; font-family: var(--sans); font-size: 14px; color: #5f6b45; }
.ws-em-note.err { color: #a0582a; }
.ws-em-next { margin-top: 18px; padding: 14px 18px; border-left: 3px solid var(--em-gold); background: var(--em-ivory);
  font-family: var(--sans); font-size: 15px; color: var(--em-ink); }
.ws-em-next em { display: block; margin: 2px 0 8px; font-family: var(--serif); font-size: 19px; color: #8a6b3d; }
.ws-em-act:focus-visible, .ws-em-chip:focus-visible, .ws-em-did:focus-visible, .ws-em-ground-btn:focus-visible,
.ws-em-why summary:focus-visible { outline: 2px solid var(--em-coral); outline-offset: 3px; border-radius: 4px; }
@media (max-width: 640px) {
  .ws-em-why dl { grid-template-columns: 1fr; gap: 2px; }
  .ws-em-why dd { margin-bottom: 10px; }
  .ws-em-have li { padding-right: 0; }
}

/* ---- returning: resume from here, or begin a new journey ----
   The first thing a returning reader sees, inside the stage rather than as a
   modal over it: where they stopped, and two plain choices. */
.dx-resume { max-width: 34em; margin: 0 auto; text-align: center; }
.dx-resume-kicker { font-family: var(--sans); font-size: 12.5px; letter-spacing: .26em; text-transform: uppercase; color: #a3762f; }
.dx-resume-head { margin-top: 14px; font-family: var(--serif); font-weight: 500; font-size: clamp(28px, 3.6vw, 40px);
  line-height: 1.12; color: #3f3830; }
.dx-resume-where { margin-top: 12px; font-family: var(--sans); font-size: 14.5px; letter-spacing: .04em; color: #8a795c; }
.dx-resume-actions { margin-top: 26px; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.dx-resume-note { margin-top: 20px; font-family: var(--sans); font-size: 13.5px; line-height: 1.6; color: #8a7a5e; }
.dx-resume button:disabled { opacity: .6; cursor: default; }


/* ---- My UNBIFY Edge: the pattern leads ----
   The finding gets the weight — a statement someone can sit with, then the
   channels that produced it, then what it gives AND what it costs. The
   trade-off is not a footnote: an Edge that only flatters is not worth
   reading, so it sits at the same size as the strength. */
.dx-edge-pattern {
  border: 1px solid rgba(201,167,110,.35); border-radius: 8px;
  background: rgba(253,249,240,.55); padding: 26px 28px; margin-bottom: 26px;
}
.dx-edge-eyebrow {
  font-family: var(--sans); font-size: 11px; letter-spacing: .12em;
  text-transform: uppercase; color: #a3947a; margin-bottom: 10px;
}
.dx-edge-title {
  font-family: var(--serif); font-size: clamp(19px, 2.6vh, 24px); color: #8d6a2b;
  margin-bottom: 10px; line-height: 1.3;
}
.dx-edge-statement {
  font-family: var(--serif); font-size: clamp(17px, 2.3vh, 21px); line-height: 1.55;
  color: #4d4133; margin-bottom: 20px;
}
/* the "so what" — present only when the phrasing pass produced one, since
   the deterministic text does not claim to know it */
.dx-edge-matters {
  font-size: 14.5px; line-height: 1.6; color: #6b5d49; font-style: italic;
  margin: -10px 0 20px; padding-left: 14px;
  border-left: 2px solid rgba(201,167,110,.4);
}
.dx-edge-why { border-top: 1px solid rgba(201,167,110,.28); padding-top: 14px; margin-bottom: 18px; }
.dx-edge-whyrow {
  display: flex; gap: 12px; align-items: baseline; margin-bottom: 7px;
  font-size: 13.5px; line-height: 1.5;
}
.dx-edge-chan {
  font-family: var(--sans); font-size: 11px; letter-spacing: .05em;
  text-transform: uppercase; color: #a3947a; flex: 0 0 152px;
}
.dx-edge-obs { color: #6b5d49; }
.dx-edge-half { border-top: 1px solid rgba(201,167,110,.28); padding-top: 14px; margin-bottom: 16px; }
.dx-edge-list { margin: 0; padding-left: 18px; }
.dx-edge-list li { font-size: 14.5px; line-height: 1.6; color: #55483a; margin-bottom: 4px; }
.dx-edge-cost .dx-edge-list li { color: #7a6b55; }
.dx-edge-chain { border-top: 1px solid rgba(201,167,110,.28); padding-top: 14px; }
.dx-edge-chain p { font-size: 14px; line-height: 1.6; color: #55483a; margin-bottom: 8px; }
.dx-edge-chk {
  display: block; font-family: var(--sans); font-size: 10.5px; letter-spacing: .08em;
  text-transform: uppercase; color: #a3947a; margin-bottom: 2px;
}
@media (max-width: 640px) {
  .dx-edge-pattern { padding: 20px 18px; }
  .dx-edge-whyrow { flex-direction: column; gap: 2px; }
  .dx-edge-chan { flex: none; }
}