/* ===== Under the hood ===== */
  .hood { background: linear-gradient(180deg, #241e17 0%, #191410 100%); color: #f0ebe1; min-height: calc(100vh - 31px); padding-bottom: 44px; }
  .hood-head { max-width: 1220px; margin: 0 auto; padding: 28px 24px 6px; display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; }
  .hood-head h1 { font-family: var(--f-serif); font-size: 26px; font-weight: 600; letter-spacing: -0.01em; color: #f7f3ea; }
  .hood-head .hsub { font-size: 12px; color: #b3a89a; margin-top: 5px; max-width: 620px; line-height: 1.65; }
  .run-chip { font-family: 'Fira Mono', monospace; font-size: 10.5px; color: #7fc7bc; background: rgba(127,199,188,0.1); border: 1px solid rgba(127,199,188,0.3); border-radius: 999px; padding: 4px 13px; white-space: nowrap; }
  .hood-grid { max-width: 1220px; margin: 0 auto; padding: 16px 24px 0; display: grid; grid-template-columns: 1.15fr 1fr; gap: 26px; align-items: start; }

  .lane-lbl { font-size: 9.5px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: #8f8578; margin: 20px 0 9px; display: flex; gap: 10px; align-items: center; }
  .lane-lbl:first-child { margin-top: 4px; }
  .lane-lbl::after { content: ''; flex: 1; height: 1px; background: rgba(240,235,225,0.1); }
  .hflow { position: relative; }
  .hflow::before { content: ''; position: absolute; left: 28px; top: 16px; bottom: 16px; width: 2px; background: rgba(240,235,225,0.09); }
  .hnode { position: relative; display: flex; gap: 13px; align-items: center; padding: 11px 15px; border: 1px solid rgba(240,235,225,0.14); border-radius: 13px; background: #251f18; margin-bottom: 10px; }
  .hnode.otel { border-style: dashed; background: #1e1913; margin-left: 34px; }
  .hicon { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-family: 'Fira Mono', monospace; font-size: 11px; font-weight: 700; z-index: 1; }
  .hicon.n1 { background: rgba(147,180,240,0.14); color: #93b4f0; border: 1px solid rgba(147,180,240,0.4); }
  .hicon.n2 { background: rgba(127,199,188,0.12); color: #7fc7bc; border: 1px solid rgba(127,199,188,0.4); }
  .hicon.n3 { background: rgba(231,217,193,0.1); color: #e7d9c1; border: 1px solid rgba(231,217,193,0.35); }
  .hicon.n4 { background: rgba(181,209,143,0.12); color: #b5d18f; border: 1px solid rgba(181,209,143,0.4); }
  .hicon.dot { background: #1e1913; color: #8f8578; border: 1px dashed rgba(240,235,225,0.3); font-size: 13px; }
  .hnode > div:not(.hstat) { flex: 1; min-width: 0; }
  .hstat { flex-shrink: 0; }
  .hnode b { font-size: 12.5px; font-weight: 600; color: #f0ebe1; display: block; }
  .hnode .hd { font-size: 11px; color: #b3a89a; margin-top: 1px; line-height: 1.5; }
  .hstat { margin-left: auto; text-align: right; flex-shrink: 0; }
  .hstat .ok { font-family: 'Fira Mono', monospace; font-size: 10.5px; color: #b5d18f; white-space: nowrap; }
  .cap-chip { display: inline-block; font-size: 8.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; border-radius: 999px; padding: 2px 9px; margin-top: 5px; }
  .cap-chip.ev { color: #7fc7bc; background: rgba(127,199,188,0.1); border: 1px solid rgba(127,199,188,0.3); }
  .cap-chip.sp { color: #8f8578; background: rgba(143,133,120,0.1); border: 1px dashed rgba(143,133,120,0.45); }
  .hood-legend { display: flex; gap: 20px; margin-top: 18px; font-size: 11px; color: #b3a89a; flex-wrap: wrap; }
  .hood-legend span { display: flex; gap: 8px; align-items: center; }
  .lg { width: 22px; height: 13px; border-radius: 5px; flex-shrink: 0; }
  .lg.ev { border: 1px solid rgba(127,199,188,0.5); background: #251f18; }
  .lg.sp { border: 1px dashed rgba(143,133,120,0.6); background: #1e1913; }

  .ev-panel { border: 1px solid rgba(240,235,225,0.12); border-radius: 15px; background: rgba(0,0,0,0.22); overflow: hidden; margin-bottom: 18px; }
  .ev-head { padding: 12px 17px; border-bottom: 1px solid rgba(240,235,225,0.1); display: flex; align-items: center; gap: 10px; }
  .ev-head b { font-size: 12.5px; font-weight: 600; color: #f0ebe1; font-family: var(--f-serif); font-size: 14px; }
  .ev-head .live { margin-left: auto; display: flex; align-items: center; gap: 6px; font-size: 9.5px; letter-spacing: 0.08em; color: #7fc7bc; text-transform: uppercase; }
  .ev-head .live::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #7fc7bc; animation: pulse 1.6s infinite; }
  @keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.3; } }
  .ev { display: flex; gap: 9px; padding: 9px 17px; border-top: 1px solid rgba(240,235,225,0.05); font-family: 'Fira Mono', monospace; font-size: 10.5px; color: #d8d0c2; align-items: baseline; }
  .ev:first-of-type { border-top: none; }
  .ev .sq { color: #8f8578; }
  .ev .gf { font-weight: 700; width: 104px; flex-shrink: 0; }
  .ev .gf.loc { color: #93b4f0; } .ev .gf.adr { color: #7fc7bc; } .ev .gf.auth { color: #e7d9c1; } .ev .gf.exch { color: #b5d18f; } .ev .gf.cons { color: #e59ab8; }
  .ev .pth { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #b3a89a; }
  .ev .st { color: #b5d18f; }
  .ev .ms { color: #8f8578; width: 56px; text-align: right; flex-shrink: 0; }
  .sp-row { border-left: 2px dashed rgba(143,133,120,0.4); margin-left: 17px; }
  .hood-note { font-size: 11px; color: #8f8578; line-height: 1.7; padding: 0 2px; }
  .hood-note b { color: #b3a89a; }

  /* ===== Under the hood dock (horizontal, bottom) ===== */
  .hood-dock { position: fixed; top: 0; right: 0; bottom: 0; width: 560px; max-width: calc(100vw - 44px); background: linear-gradient(180deg, #241e17 0%, #191410 100%); color: #f0ebe1; z-index: 160; transform: translateX(105%); transition: transform 0.28s cubic-bezier(0.32,0.72,0.28,1); display: flex; flex-direction: column; box-shadow: -24px 0 70px rgba(0,0,0,0.3); border-left: 1px solid rgba(240,235,225,0.12); }
  .hood-dock.on { transform: none; }
  .dock-map { flex-shrink: 0; padding: 8px 14px 0; }
  .dock-map svg { width: 100%; height: auto; max-height: 35vh; display: block; margin: 0 auto; }
  .dock-info { flex: 1; min-height: 0; border-top: 1px solid rgba(240,235,225,0.1); display: flex; flex-direction: column; }
  .hd-head { padding: 14px 22px 12px; border-bottom: 1px solid rgba(240,235,225,0.1); display: flex; align-items: flex-start; gap: 12px; }
  .hd-eyebrow { display: flex; align-items: center; gap: 7px; font-size: 9px; font-weight: 700; letter-spacing: 0.13em; text-transform: uppercase; color: #7fc7bc; margin-bottom: 5px; }
  .hd-eyebrow::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: #7fc7bc; animation: pulse 1.6s infinite; }
  .hd-head h3 { font-family: var(--f-serif); font-size: 16.5px; font-weight: 600; color: #f7f3ea; letter-spacing: -0.01em; line-height: 1.3; }
  .hd-close { margin-left: auto; width: 30px; height: 30px; border-radius: 50%; border: 1px solid rgba(240,235,225,0.2); background: transparent; color: #b3a89a; font-size: 12px; cursor: pointer; flex-shrink: 0; }
  .hd-close:hover { background: rgba(240,235,225,0.07); color: #f0ebe1; }
  .hd-mode { display: flex; gap: 3px; background: rgba(240,235,225,0.07); border: 1px solid rgba(240,235,225,0.13); border-radius: 999px; padding: 3px; width: fit-content; margin: 12px 22px 2px; }
  .hd-mode button { background: none; border: none; color: #b3a89a; font-family: 'Inter', sans-serif; font-size: 10.5px; font-weight: 600; padding: 4px 14px; border-radius: 999px; cursor: pointer; transition: background 0.15s, color 0.15s; }
  .hd-mode button.on { background: #f0ebe1; color: #1c1917; }
  .hreq { display: none; font-family: 'Fira Mono', monospace; font-size: 9.5px; color: #b3a89a; margin-top: 8px; padding-top: 8px; border-top: 1px dashed rgba(240,235,225,0.13); line-height: 1.8; }
  body.hood-tech .hood-dock .hreq { display: block; }
  .hreq .rq { display: flex; gap: 8px; align-items: baseline; }
  .hreq .m { color: #8f8578; flex-shrink: 0; }
  .hreq .p { color: #d8d0c2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; min-width: 0; }
  .hreq .s { margin-left: auto; color: #b5d18f; white-space: nowrap; padding-left: 8px; }
  .hreq .s.err { color: #e59ab8; }
  .hreq .s.pend { color: #6e6558; }
  body:not(.hood-tech) .hood-dock .hnode.otel { display: none; }
  body:not(.hood-tech) .hood-dock .ev-panel { display: none; }
  body:not(.hood-tech) .hood-dock .lane-lbl.tech { display: none; }
  body:not(.hood-tech) .hood-dock .hd-note.tech { display: none; }
  body:not(.hood-tech) .hood-dock .cap-chip.ev, body:not(.hood-tech) .hood-dock .cap-chip.sp { display: none; }
  body:not(.hood-tech) .hd-run { display: none; }
  .hd-body { flex: 1; overflow-y: auto; padding: 6px 22px 20px; }
  .hd-sec { display: none; }
  .hd-sec.on { display: block; }
  .hd-note { font-size: 10.5px; color: #8f8578; line-height: 1.65; margin-top: 12px; }
  .hd-note b { color: #b3a89a; }
  .hd-foot { border-top: 1px solid rgba(240,235,225,0.1); padding: 13px 22px; display: flex; justify-content: space-between; align-items: center; gap: 10px; }
  .hd-run { font-family: 'Fira Mono', monospace; font-size: 10px; color: #8f8578; }
  .hd-link { background: none; border: none; color: #7fc7bc; font-family: 'Inter', sans-serif; font-size: 11.5px; font-weight: 600; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
  .hd-link:hover { color: #a8ddd5; }
  .hood-dock .hnode { padding: 10px 13px; margin-bottom: 8px; }
  .hood-dock .hnode.otel { margin-left: 26px; }
  .hood-dock .hflow::before { left: 26px; }
  .hood-dock .hicon { width: 27px; height: 27px; font-size: 10px; }
  .hood-dock .hnode b { font-size: 12px; }
  .hood-dock .hnode .hd { font-size: 10.5px; }
  .hood-dock .ev { padding: 8px 13px; font-size: 10px; }
  .hood-dock .ev .gf { width: 86px; }
  .hood-dock .ev-panel { margin-bottom: 0; }
  .hood-dock .lane-lbl { margin: 16px 0 8px; }
  .hicon.n5 { background: rgba(229,154,184,0.12); color: #e59ab8; border: 1px solid rgba(229,154,184,0.4); }
  .ev .st.err { color: #e59ab8; }
  .cap-chip.plan { color: #e7d9c1; background: rgba(231,217,193,0.07); border: 1px dashed rgba(231,217,193,0.4); }
  .hnode.plan { border-style: dashed; background: #1e1913; }
  .hstat .pend { font-family: 'Fira Mono', monospace; font-size: 10.5px; color: #6e6558; white-space: nowrap; }
  .app { transition: padding 0.28s cubic-bezier(0.32,0.72,0.28,1); }
  /* Only reserve room for the dock where there is room to spare. The dock is
     position:fixed, so without this padding it simply overlays the content
     instead of displacing it, which is the right trade below this width: the
     reservation is 574px, and on a 1024px viewport it left 224px for the record
     once the 226px sidebar was taken, which is narrower than a single card. */
  @media (min-width: 1400px) {
    body.hood-open .app { padding-right: 574px; }
  }
  .gf-tab { position: absolute; top: 50%; right: calc(100% - 2px); transform: translateY(-50%); display: flex; flex-direction: column; align-items: center; gap: 8px; background: #1f1913; border: 1px solid rgba(240,235,225,0.14); border-right: none; border-radius: 11px 0 0 11px; padding: 12px 7px 13px 8px; cursor: pointer; font-family: 'Inter', sans-serif; box-shadow: -8px 0 22px rgba(0,0,0,0.28); transition: border-color 0.15s; }
  .hood-dock.peek { transform: translateX(100%); }
  .gf-tab svg { width: 13px; height: 13px; color: #7fc7bc; }
  .gf-tab .lblv { writing-mode: vertical-rl; font-size: 10px; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: #d8d0c2; }
  .gf-tab .chev { color: #8f8578; font-size: 9.5px; transform: rotate(180deg); transition: transform 0.28s; }
  body.hood-open .gf-tab .chev { transform: none; }
  .gf-tab:hover { border-color: rgba(127,199,188,0.45); }
  .gf-tab:hover .lblv { color: #f0ebe1; }

  /* Routes and both packet directions use the same SVG geometry. */
  .js-dim { opacity: 0.3; transition: opacity 0.25s; }
  .js-dim.lit { opacity: 1; }
  .js-service { fill: #2d2620; stroke: rgba(240,235,225,0.35); stroke-width: 1; }
  .js-path { stroke: #7fc7bc; stroke-width: 1.8; fill: none; opacity: 0; }
  .js-path.lit { opacity: 0.7; }
  .js-path.lit.deny { stroke: #e59ab8; }
  .js-path.lit.event-error { stroke: #e9ba72; }
  .js-dim.lit.deny { filter: drop-shadow(0 0 5px rgba(229,154,184,0.4)); }
  .js-dim.lit.event-error { filter: drop-shadow(0 0 5px rgba(233,186,114,0.4)); }
  .js-lbl { font-family: 'Inter', sans-serif; font-size: 12px; font-weight: 600; fill: #f0ebe1; }
  .js-lbl2 { font-family: 'Fira Mono', monospace; font-size: 8.5px; fill: #b3a89a; }
  .js-band { font-family: 'Fira Mono', monospace; font-size: 9px; letter-spacing: 0.16em; fill: rgba(147,180,240,0.7); }
  .js-sprite { opacity: 0; offset-rotate: 0deg; }
  .js-sprite text { font-family: 'Fira Mono', monospace; font-size: 8px; fill: #f0ebe1; }
  .js-sprite.deny rect { stroke: #e59ab8; }
  .js-sprite.event-error rect { stroke: #e9ba72; }
  .gf-map-caption { padding: 10px 8px 12px; min-height: 58px; }
  #gf-stage-caption { font-size: 12px; font-weight: 600; color: #f0ebe1; line-height: 1.5; }
  #gf-stage-detail { font-size: 10.5px; color: #b3a89a; line-height: 1.6; margin-top: 3px; }
  .quick-add { display: inline-flex; gap: 7px; align-items: center; border: 1px dashed var(--line2); background: transparent; color: var(--text2); border-radius: 999px; padding: 6px 15px; font-size: 11px; font-weight: 600; cursor: pointer; font-family: 'Inter', sans-serif; margin-top: 10px; transition: border 0.15s, color 0.15s, background 0.15s; }
  .quick-add:hover { border-color: var(--teal); color: var(--teal-deep); background: var(--teal-soft); }

  /* Patient-row and status-chip rules belong in ehr.css. Unscoped copies here
     load after it and win the cascade, which once recoloured the chips and
     shrank the avatar. */

  .hd-idle { font-size: 11.5px; line-height: 1.6; color: rgba(240,235,225,0.72); margin-bottom: 10px; }

  .gf-stream-status { margin: 8px 22px; color: #b3a89a; font-size: 10.5px; line-height: 1.5; }
  /* Actions, stages and calls nest; a result takes the outcome of its nearest owner. */
  .gf-step-ok { --gf-result-color: #b3a89a; }
  .gf-step-deny { --gf-result-color: #e59ab8; }
  .gf-step-error { --gf-result-color: #e9ba72; }
  .gf-step-result { font-size: 10.5px; line-height: 1.5; color: var(--gf-result-color, #b3a89a); margin-top: 3px; }


  /* The edge tab remains reachable while the panel contents are inert. */
  .hood-content { display: flex; flex-direction: column; flex: 1; min-height: 0; }
  .gf-tab:focus-visible, .hd-close:focus-visible, .hd-mode button:focus-visible { outline: 2px solid #7fc7bc; outline-offset: 3px; }

  .hood-dock .js-sprite.go { animation: gf-request 1.1s ease-in-out both; }
  .hood-dock #js-response.go { animation: gf-response 1.1s ease-in-out 1.2s both; }
  .hood-dock.playback-paused :is(.js-sprite.go, #js-response.go) { animation-play-state: paused; }
  @keyframes gf-request {
    0% { offset-distance: 0%; opacity: 0; }
    12%, 88% { opacity: 1; }
    100% { offset-distance: 100%; opacity: 0; }
  }
  @keyframes gf-response {
    0% { offset-distance: 100%; opacity: 0; }
    12%, 88% { opacity: 1; }
    100% { offset-distance: 0%; opacity: 0; }
  }
  @media (prefers-reduced-motion: reduce) {
    .hood-dock .js-sprite.go, .hd-eyebrow::before { animation: none; }
    .hood-dock, .hood-dock .js-dim { transition: none; }
  }

  .gf-playback-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 0 22px 10px; }
  .gf-playback-controls button { border: 1px solid rgba(240,235,225,0.24); border-radius: 999px; padding: 5px 11px; background: rgba(240,235,225,0.06); color: #f0ebe1; font: inherit; font-size: 10px; cursor: pointer; }
  .gf-playback-controls button:disabled { opacity: 0.4; cursor: default; }
  .gf-playback-controls button:focus-visible { outline: 2px solid #7fc7bc; outline-offset: 3px; }
  #gf-playback-status { flex-basis: 100%; color: #b3a89a; font-size: 10px; line-height: 1.5; }
  .gf-technical { display: none; }
  body.hood-tech .gf-technical { display: block; }
  body.hood-tech .gf-functional { display: none; }
  .gf-timeline, .gf-stages, .gf-calls { list-style: none; margin: 0; padding: 0; }
  .gf-timeline { padding-left: 13px; }
  .gf-action { position: relative; border-left: 1px solid rgba(240,235,225,0.2); padding: 0 0 16px 19px; }
  .gf-action::before { content: ''; position: absolute; left: -5px; top: 20px; width: 9px; height: 9px; border-radius: 50%; background: #7fc7bc; box-shadow: 0 0 0 4px #241e17; }
  .gf-action.gf-step-error::before { background: #e9ba72; }
  .gf-action.gf-step-deny::before { background: #e59ab8; }
  .gf-action-selected::before { box-shadow: 0 0 0 4px #241e17, 0 0 0 5px #7fc7bc; }
  .gf-action-select { display: block; width: 100%; padding: 12px; text-align: left; font: inherit; border: 1px solid rgba(240,235,225,0.16); border-radius: 9px; background: rgba(240,235,225,0.025); color: #f0ebe1; cursor: pointer; }
  .gf-action-select:hover { background: rgba(127,199,188,0.08); border-color: #7fc7bc; }
  .gf-action-select:focus-visible { outline: 2px solid #7fc7bc; outline-offset: 3px; }
  .gf-action-selected > .gf-action-select { background: rgba(127,199,188,0.075); border-color: rgba(127,199,188,0.6); }
  .gf-action-heading { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 5px 12px; }
  .gf-action-heading strong { font-size: 13px; font-weight: 600; }
  .gf-action-heading time { font-family: 'Fira Mono', monospace; font-size: 10px; color: #b3a89a; }
  .gf-action-result, .gf-action-summary, .gf-action-play { display: block; font-size: 10.5px; line-height: 1.6; margin-top: 4px; }
  .gf-action-result { color: #b3a89a; }
  .gf-action-summary { color: #d8d0c2; }
  .gf-action-play { font-size: 9.5px; color: #7fc7bc; margin-top: 7px; }
  .gf-action > .gf-functional, .gf-action > .gf-technical { margin: 12px 0 0; }
  .gf-stage { display: flex; align-items: flex-start; gap: 10px; padding: 10px 8px; border-radius: 7px; }
  .gf-stage + .gf-stage { border-top: 1px solid rgba(240,235,225,0.07); }
  .gf-stage-number { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 21px; height: 21px; border-radius: 50%; background: rgba(240,235,225,0.08); color: #b3a89a; font-size: 10px; }
  .gf-stage-content { min-width: 0; }
  .gf-stage h4 { font-size: 11.5px; font-weight: 600; line-height: 1.6; color: #f0ebe1; }
  .gf-stage-current { background: rgba(127,199,188,0.09); }
  .gf-stage-current .gf-stage-number { background: #7fc7bc; color: #241e17; }
  .gf-stage-now { display: block; margin-top: 4px; font-size: 9.5px; color: #7fc7bc; }
  .gf-call { margin-top: 8px; border: 1px solid rgba(240,235,225,0.13); border-left: 2px solid #7fc7bc; border-radius: 6px; overflow: hidden; }
  .gf-call.gf-step-error { border-left-color: #e9ba72; }
  .gf-call.gf-step-deny { border-left-color: #e59ab8; }
  .gf-call > summary { cursor: pointer; padding: 9px 10px; }
  .gf-call-title { font-size: 10.5px; color: #f0ebe1; line-height: 1.5; }
  .gf-call-meta, .gf-call-path { display: block; font-family: 'Fira Mono', monospace; font-size: 9px; line-height: 1.6; color: #b3a89a; margin-top: 4px; overflow-wrap: anywhere; }
  .gf-call-path { color: #d8d0c2; }
  .gf-http-exchange { padding: 0 10px; }
  .gf-http-exchange section { padding: 9px 0; border-top: 1px solid rgba(240,235,225,0.13); }
  .gf-http-exchange h5 { font-size: 10.5px; font-weight: 600; color: #93b4f0; }
  .gf-http-response h5 { color: #7fc7bc; }
  .gf-http-status, .gf-call pre { font-family: 'Fira Mono', monospace; font-size: 9.5px; line-height: 1.7; overflow-wrap: anywhere; white-space: pre-wrap; color: #d8d0c2; margin-top: 5px; }
  .gf-http-label { color: #8f8578; font-size: 9px; margin-top: 8px; }
  .gf-call > .gf-step-result { padding: 0 10px 8px; }
  .gf-internal { margin: 0 10px 10px; padding-left: 9px; border-left: 1px dashed rgba(147,180,240,0.35); }
  .gf-background { margin: 12px 0; padding-top: 12px; border-top: 1px solid rgba(240,235,225,0.14); }
  .gf-background > summary, .gf-background-action > summary { font-size: 10.5px; color: #b3a89a; padding: 6px 0; cursor: pointer; }
  .gf-technical summary { overflow-wrap: anywhere; }
  @media (max-width: 600px) {
    .dock-map { padding: 4px 8px 0; }
    .dock-map svg { max-height: 28vh; }
    .gf-map-caption { padding: 6px 6px 8px; min-height: 0; }
    .gf-timeline { padding-left: 5px; }
    .gf-action { padding-left: 13px; }
    .hd-head { padding: 10px 14px; }
    .hd-body { padding: 6px 14px 14px; }
    .gf-playback-controls { padding: 0 14px 8px; }
    .gf-stream-status, .hd-mode { margin-left: 14px; margin-right: 14px; }
  }

  .hd-body { overflow-anchor: none; }
  .gf-access-contract { margin: 0 8px 10px; padding: 9px 11px; border: 1px solid rgba(217,180,106,0.35); border-radius: 8px; background: rgba(217,180,106,0.04); }
  .gf-access-contract[hidden] { display: none; }
  .gf-access-contract > strong { color: #e7d9c1; font-size: 10.5px; font-weight: 600; }
  .gf-contract-terms { display: flex; flex-wrap: wrap; gap: 4px 7px; margin: 6px 0; }
  .gf-contract-terms span { font-size: 9px; color: #c3b8a9; border: 1px solid rgba(240,235,225,0.16); border-radius: 4px; padding: 3px 5px; }
  #gf-contract-status { font-size: 10px; line-height: 1.5; color: #d8d0c2; }
  .js-token-icon { display: none; stroke: #d9b46a; fill: none; stroke-width: 1.5; }
  .token-received .js-token-icon, .token-attached .js-token-icon { display: inline; }
  .token-received > rect, .token-attached > rect { stroke: #d9b46a; }
  .token-received #js-response-label, .token-attached #js-request-label { transform: translateX(8px); fill: #d9b46a; }
  #js-vault-door { transform-origin: 482px 304px; }
  .vault-open #js-vault-door { animation: gf-vault-open 0.5s ease-out 1.1s both; }
  .hood-dock.playback-paused .vault-open #js-vault-door { animation-play-state: paused; }
  @keyframes gf-vault-open { from { transform: scaleX(1); } to { transform: scaleX(0.12); } }
  @media (prefers-reduced-motion: reduce) {
    .vault-open #js-vault-door { animation: none; transform: scaleX(0.12); }
  }