:root{--bg:#080908;--panel:#0b0c0b;--line:#30322f;--line-soft:#1d1f1d;--text:#f1f2ed;--muted:#777b74;--accent:#a8ff28;--mono:"DM Mono",monospace;--sans:"Inter",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);min-height:100vh;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:48px 48px}button,input{font:inherit}.staking-shell{width:min(1540px,calc(100% - 32px));margin:16px auto;border:1px solid var(--line);background:rgba(7,8,7,.96)}.staking-header{height:74px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 24px}.staking-brand{display:flex;gap:13px;align-items:center;color:var(--text);text-decoration:none;letter-spacing:.14em}.staking-brand svg{width:25px;fill:none;stroke:currentColor;stroke-width:1.7}.staking-network{font:10px var(--mono);letter-spacing:.16em;color:var(--muted);display:flex;gap:10px;align-items:center}.staking-network i{width:6px;height:6px;border-radius:50%;background:var(--text);box-shadow:0 0 0 3px #272a26}.staking-network em{width:1px;height:14px;background:var(--line)}.staking-actions{justify-self:end;display:flex;gap:8px}.staking-refresh{width:38px;height:38px;border:1px solid #4a4d48;background:transparent;color:var(--text);cursor:pointer}.staking-refresh.loading{animation:spin 900ms linear infinite}.wallet-button{height:38px;padding:0 15px;border:1px solid #4a4d48;background:transparent;color:var(--text);font:10px var(--mono);letter-spacing:.09em;display:flex;gap:30px;align-items:center;cursor:pointer}.wallet-button:hover,.wallet-button.connected{background:var(--text);color:#080908}.staking-shell main{padding:clamp(32px,5vw,72px)}.staking-intro{display:grid;grid-template-columns:1.25fr .75fr;align-items:end;margin-bottom:40px}.staking-intro>span{grid-column:1/-1;font:10px var(--mono);letter-spacing:.18em;color:var(--muted);margin-bottom:16px}.staking-intro h1{font-size:clamp(54px,7vw,112px);line-height:.84;letter-spacing:-.07em;margin:0;font-weight:500}.staking-intro h1 em{color:#555954;font-style:normal}.staking-intro p{max-width:450px;justify-self:end;margin:0 0 8px;color:#a5a8a2;font-size:17px;line-height:1.55}.staking-yield-module{margin-bottom:28px;min-height:640px}.staking-workspace{display:grid;grid-template-columns:minmax(330px,.82fr) minmax(500px,1.18fr);border:1px solid var(--line)}.stake-form-panel,.stake-summary-panel{padding:26px 28px}.stake-form-panel{border-right:1px solid var(--line)}.stake-form-panel>header,.stake-summary-panel>header{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px solid var(--line-soft);padding-bottom:18px;margin-bottom:20px}.stake-form-panel header span,.stake-summary-panel header span{font:9px var(--mono);letter-spacing:.15em;color:var(--muted)}.stake-form-panel h2{font-size:20px;margin:7px 0 0}.stake-form-panel header>b,.stake-summary-panel header>b{font:9px var(--mono);letter-spacing:.1em;border:1px solid var(--line);padding:7px 9px;color:#a6aaa3}.wallet-strip{display:flex;justify-content:space-between;gap:16px;color:var(--muted);font:9px var(--mono);letter-spacing:.1em;margin-bottom:28px}.wallet-strip code{color:var(--text);font:10px var(--mono)}.field-label{display:flex;justify-content:space-between;font:9px var(--mono);letter-spacing:.12em;color:#9a9d97;margin:20px 0 8px}.amount-field{height:74px;border:1px solid var(--line);display:flex;align-items:center;padding:0 18px}.amount-field input{min-width:0;flex:1;background:transparent;border:0;outline:0;color:var(--text);font:36px var(--mono)}.amount-field span{font:10px var(--mono);color:var(--muted)}.amount-field.compact{height:62px}.amount-field.compact input{font-size:27px}.quick-row{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:7px}.quick-row button{border:1px solid var(--line-soft);background:transparent;color:var(--muted);padding:8px;font:9px var(--mono);cursor:pointer}.quick-row button:hover{border-color:#777b74;color:var(--text)}.field-help{margin:8px 0;color:#62665f;font:9px var(--mono)}.lock-control{border-top:1px solid var(--line-soft);margin-top:25px;padding-top:21px}.lock-control label,.lock-control>div{display:flex;justify-content:space-between;font:9px var(--mono);letter-spacing:.1em;color:#8b8f88}.lock-control output{color:var(--text)}.lock-control input{width:100%;height:2px;appearance:none;background:#343733;margin:23px 0 12px;cursor:pointer}.lock-control input::-webkit-slider-thumb{appearance:none;width:13px;height:13px;background:var(--text);border:3px solid #080908;box-shadow:0 0 0 1px var(--text)}.compound-control{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--line);padding:15px;margin-top:24px}.compound-control span{display:flex;flex-direction:column;gap:5px}.compound-control b{font:11px var(--mono)}.compound-control small{font:9px var(--mono);color:var(--muted)}.compound-control input{position:absolute;opacity:0}.compound-control i{width:38px;height:18px;border:1px solid #494c47;position:relative}.compound-control i:before{content:"";position:absolute;width:10px;height:10px;left:3px;top:3px;background:#595d56;transition:.2s}.compound-control input:checked+i{border-color:var(--accent)}.compound-control input:checked+i:before{left:23px;background:var(--accent)}.stake-submit{width:100%;height:50px;margin-top:18px;background:var(--text);color:#080908;border:0;font:10px var(--mono);font-weight:500;letter-spacing:.08em;display:flex;justify-content:space-between;align-items:center;padding:0 17px;cursor:pointer}.stake-submit:disabled{background:#222421;color:#6e726b;cursor:not-allowed}.stake-notice{min-height:28px;margin:10px 0 0;color:#6f736c;font:9px/1.5 var(--mono)}.stake-summary-panel{min-width:0}.reward-main{padding:22px 0 26px}.reward-main small{display:block;font:9px var(--mono);letter-spacing:.14em;color:var(--muted);margin-bottom:12px}.reward-main strong{font:clamp(50px,6vw,92px) var(--mono);letter-spacing:-.07em;color:var(--accent)}.reward-main>span{font:11px var(--mono);color:#9ca098;margin-left:10px}.reward-main em{display:block;color:#8b8f88;font:10px var(--mono);font-style:normal;margin-top:7px}.summary-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line)}.summary-grid span{display:flex;flex-direction:column;gap:9px;padding:13px;border-right:1px solid var(--line)}.summary-grid span:last-child{border:0}.summary-grid small,.protocol-stats small{font:8px var(--mono);letter-spacing:.1em;color:var(--muted)}.summary-grid b{font:14px var(--mono)}.stake-curve{margin-top:22px}.stake-curve svg{width:100%;height:230px;overflow:visible}.stake-curve .grid{fill:none;stroke:#20231f;stroke-dasharray:2 8}.stake-curve .area{fill:rgba(168,255,40,.06)}.stake-curve .line{fill:none;stroke:var(--text);stroke-width:1.4}.stake-curve circle{fill:var(--accent);stroke:#080908;stroke-width:3}.stake-curve>div{display:flex;justify-content:space-between;color:#5c6059;font:8px var(--mono)}.protocol-stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);margin-top:18px}.protocol-stats span{display:flex;flex-direction:column;gap:8px;padding:14px 12px 0;border-right:1px solid var(--line-soft)}.protocol-stats span:last-child{border:0}.protocol-stats b{font:13px var(--mono)}.staking-proof{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-top:0}.staking-proof>span{padding:22px;display:grid;grid-template-columns:auto 1fr;gap:6px 18px;border-right:1px solid var(--line)}.staking-proof>span:last-child{border:0}.staking-proof small{grid-row:1/3;color:#565a54;font:9px var(--mono)}.staking-proof b{font:11px var(--mono)}.staking-proof em{font:8px var(--mono);font-style:normal;color:var(--muted)}.staking-shell>footer{display:grid;grid-template-columns:1fr 2fr 1fr;gap:20px;border-top:1px solid var(--line);padding:20px 24px;align-items:center;font:8px/1.5 var(--mono);letter-spacing:.08em;color:#666a64}.staking-shell>footer a{color:#aeb1ac;text-decoration:none}.staking-shell>footer p{text-align:center;margin:0}.staking-shell>footer span{text-align:right}
@media(max-width:920px){.staking-header{grid-template-columns:1fr auto}.staking-network{display:none}.staking-shell main{padding:30px 18px}.staking-intro{grid-template-columns:1fr}.staking-intro p{justify-self:start;margin-top:26px}.staking-workspace{grid-template-columns:1fr}.stake-form-panel{border-right:0;border-bottom:1px solid var(--line)}.staking-proof{grid-template-columns:1fr 1fr}.staking-proof>span:nth-child(2){border-right:0}.staking-proof>span:nth-child(-n+2){border-bottom:1px solid var(--line)}}
@media(max-width:600px){.staking-shell{width:100%;margin:0;border-left:0;border-right:0}.staking-header{padding:0 14px}.wallet-button{gap:12px;padding:0 10px}.staking-intro h1{font-size:54px}.stake-form-panel,.stake-summary-panel{padding:20px 15px}.summary-grid,.protocol-stats{grid-template-columns:1fr 1fr}.summary-grid span:nth-child(2),.protocol-stats span:nth-child(2){border-right:0}.summary-grid span:nth-child(-n+2){border-bottom:1px solid var(--line)}.staking-proof{grid-template-columns:1fr}.staking-proof>span{border-right:0;border-bottom:1px solid var(--line)}.staking-shell>footer{grid-template-columns:1fr}.staking-shell>footer p,.staking-shell>footer span{text-align:left}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.staking-shell>footer>div{display:flex;gap:18px;flex-wrap:wrap}.staking-shell>footer a:hover{color:var(--text)}

/* Staking page sequence: calculator, live market, FAQ */
.staking-shell main {
  display: flex;
  flex-direction: column;
}
.staking-intro { order: 1; }
.staking-yield-module { order: 2; }
.staking-market { order: 3; }
.staking-faq { order: 4; }
.staking-workspace[hidden],
.staking-proof[hidden] { display: none !important; }

/* Stake builder and yield projection share one unified module. */
.staking-yield-module {
  height: auto;
  min-height: 720px;
  display: grid;
  grid-template-columns: minmax(330px, .36fr) minmax(0, .64fr);
  grid-template-rows: auto;
  overflow: hidden;
  border-color: #3a3d39;
  background: #070807;
  box-shadow: none;
}

.integrated-stake-panel {
  min-width: 0;
  background: #070807;
  border-right-color: #3a3d39;
}

.staking-calculator-panel {
  min-width: 0;
  display: grid;
  grid-template-rows: 47px 130px 45px minmax(360px, 1fr) 33px;
}

.staking-faq {
  margin-top: 24px;
  border: 1px solid var(--line);
  background: rgba(7,8,7,.92);
}
.staking-faq > header {
  min-height: 245px;
  padding: 34px 38px;
  display: grid;
  grid-template-columns: minmax(0,1.15fr) minmax(280px,.85fr);
  align-items: end;
  gap: 48px;
  border-bottom: 1px solid var(--line);
}
.staking-faq > header > span {
  grid-column: 1 / -1;
  align-self: start;
  font: 9px var(--mono);
  letter-spacing: .16em;
  color: var(--muted);
}
.staking-faq h2 {
  margin: 0;
  font-size: clamp(44px,5.8vw,82px);
  font-weight: 500;
  line-height: .88;
  letter-spacing: -.065em;
}
.staking-faq h2 em { color: #555954; font-style: normal; }
.staking-faq header p {
  max-width: 430px;
  margin: 0 0 5px;
  color: #969a93;
  font-size: 14px;
  line-height: 1.6;
}
.staking-faq-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
}
.staking-faq details {
  min-height: 154px;
  padding: 0 28px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.staking-faq details:nth-child(2n) { border-right: 0; }
.staking-faq details:nth-last-child(-n+2) { border-bottom: 0; }
.staking-faq summary {
  min-height: 92px;
  display: grid;
  grid-template-columns: 34px 1fr auto;
  align-items: center;
  gap: 16px;
  cursor: pointer;
  list-style: none;
}
.staking-faq summary::-webkit-details-marker { display: none; }
.staking-faq summary span { color: #535750; font: 8px var(--mono); }
.staking-faq summary b { font: 500 11px var(--mono); letter-spacing: .1em; }
.staking-faq summary i { color: #8d918a; font: normal 18px var(--mono); transition: transform .18s ease; }
.staking-faq details[open] summary i { transform: rotate(45deg); color: var(--text); }
.staking-faq details p {
  max-width: 570px;
  margin: -4px 34px 28px 50px;
  color: #969a93;
  font-size: 13px;
  line-height: 1.65;
}

@media(max-width:760px){
  .staking-proof { margin-bottom: 32px; }
  .staking-faq > header { min-height: 0; padding: 30px 20px; grid-template-columns: 1fr; gap: 24px; }
  .staking-faq-grid { grid-template-columns: 1fr; }
  .staking-faq details { border-right: 0; border-bottom: 1px solid var(--line)!important; padding-inline: 18px; }
  .staking-faq details:last-child { border-bottom: 0!important; }
  .staking-faq details p { margin-left: 50px; }
}

/* Staking charts */
body {
  position: relative;
  overflow-x: hidden;
  background: #050605;
  background-image: none;
}

.staking-shell {
  position: relative;
  background: #070807;
  backdrop-filter: none;
}

.stake-curve {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(255,255,255,.018), transparent 72%);
}

.stake-curve .grid {
  stroke: rgba(173,177,169,.13);
  stroke-dasharray: 3 11;
}

.stake-curve .area {
  fill: rgba(154,158,151,.19);
  opacity: 0;
  animation: stake-area-reveal 1.5s .25s ease forwards;
}

.stake-curve .line {
  fill: none;
  stroke: #aeb2aa;
  stroke-width: 2.35;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  filter: drop-shadow(0 0 5px rgba(211,214,207,.23));
  animation: stake-line-draw 1.8s cubic-bezier(.2,.72,.2,1) forwards;
}

.stake-curve circle {
  fill: #c5c8c1;
  stroke: #080908;
  stroke-width: 3;
  filter: drop-shadow(0 0 7px rgba(224,226,221,.58));
  animation: stake-end-pulse 2.8s ease-in-out infinite;
}

.staking-yield-module .chart-area {
  fill: rgba(154,158,151,.18);
}

.staking-yield-module .chart-line {
  stroke: #f1f2ed;
  stroke-width: 2.35;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: none !important;
  stroke-dashoffset: 0 !important;
  filter: drop-shadow(0 0 5px rgba(211,214,207,.2));
  animation: none !important;
  opacity: 1 !important;
}

.staking-yield-module .chart-end,
.staking-yield-module .chart-hover-point {
  fill: #c5c8c1;
  stroke: #080908;
  filter: drop-shadow(0 0 6px rgba(210,213,207,.42));
}

.staking-yield-module .chart-status i {
  background: #b7bbb3;
  box-shadow: none;
}

/* Green is reserved for enabled switches and the estimated reward result. */
.staking-yield-module .live-chip {
  border-color: #4a4d48;
  color: var(--text);
  background: transparent;
}

.staking-yield-module .rate-strip > span:nth-child(5) b,
.staking-yield-module .chart-tooltip strong {
  color: var(--text);
}

.staking-yield-module .metric-input input:focus {
  border-bottom-color: var(--text);
}

.staking-yield-module .module-chart {
  background: var(--panel);
}

.staking-yield-module .result-cell {
  background: linear-gradient(135deg, rgba(255,255,255,.018), transparent 66%);
}

.staking-yield-module .result-value strong {
  color: var(--accent);
  text-shadow: 0 0 22px rgba(168,255,40,.12);
}

.staking-yield-module .switch-control:focus-within {
  outline-color: #777b74;
}

.staking-yield-module .switch-control:has(input:checked):focus-within {
  outline-color: var(--accent);
}

.staking-yield-module .switch-control input:checked + i {
  border-color: var(--accent);
  background: rgba(168,255,40,.08);
}

.staking-yield-module .switch-control input:checked + i::after {
  background: var(--accent);
}

@keyframes stake-line-draw { to { stroke-dashoffset: 0; } }
@keyframes stake-area-reveal { to { opacity: 1; } }
@keyframes stake-end-pulse {
  0%, 100% { r: 4px; opacity: .72; }
  50% { r: 5.5px; opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .stake-curve .area,
  .stake-curve .line,
  .stake-curve circle { animation: none !important; }
  .stake-curve .area { opacity: 1; }
  .stake-curve .line { stroke-dashoffset: 0; }
}

/* The restored calculator leads the page; live market follows below. */

.staking-market {
  margin-bottom: 28px;
  border: 1px solid var(--line);
  background: rgba(5,6,5,.96);
  overflow: hidden;
}

.market-header {
  min-height: 218px;
  display: grid;
  grid-template-columns: minmax(0,1.4fr) minmax(260px,.6fr);
  align-items: end;
  gap: 42px;
  padding: 34px 38px 32px;
  border-bottom: 1px solid var(--line);
  background:
    linear-gradient(110deg, rgba(255,255,255,.025), transparent 42%),
    #070807;
}

.market-header > div:first-child > span,
.market-quote small,
.market-toolbar,
.market-stats small {
  font: 9px var(--mono);
  letter-spacing: .14em;
  color: #747871;
}

.market-header h2 {
  margin: 16px 0 0;
  font-size: clamp(48px,6.1vw,88px);
  line-height: .9;
  letter-spacing: -.065em;
  font-weight: 500;
}

.market-header h2 em { color: #565a55; font-style: normal; }

.market-quote {
  justify-self: end;
  width: min(100%,420px);
  display: grid;
  justify-items: end;
  align-content: end;
}

.market-quote strong {
  margin-top: 12px;
  font: clamp(38px,4.4vw,68px)/1 var(--mono);
  letter-spacing: -.06em;
  color: #e4e6e1;
}

.market-quote span {
  margin-top: 10px;
  padding: 6px 8px;
  border: 1px solid #3d403c;
  font: 9px var(--mono);
  letter-spacing: .08em;
  color: #9ca099;
}

.market-quote span.is-positive { color: #dfe2dc; border-color: #71756e; }
.market-quote span.is-negative { color: #858982; }

.market-toolbar {
  min-height: 58px;
  padding: 0 20px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 24px;
  border-bottom: 1px solid var(--line);
}

.market-toolbar > span { text-align: center; color: #62665f; }
.market-toolbar a { color: #b8bbb5; text-decoration: none; white-space: nowrap; }
.market-toolbar a:hover { color: #fff; }

.market-range { display: flex; gap: 4px; }
.market-range button {
  min-width: 44px;
  height: 28px;
  padding: 0 9px;
  border: 1px solid transparent;
  background: transparent;
  color: #666a63;
  font: 9px var(--mono);
  cursor: pointer;
}
.market-range button:hover { color: #d8dad5; }
.market-range button.is-active { border-color: #656961; color: #f0f1ed; background: #111210; }

.market-chart { margin: 0; }
.market-chart-stage {
  position: relative;
  height: clamp(360px,42vw,560px);
  min-height: 360px;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(255,255,255,.018), transparent 36%),
    #050605;
}
.market-tradingview-chart {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.market-tradingview-chart canvas { cursor: crosshair; }
.market-chart-hint {
  position: absolute;
  z-index: 3;
  top: 14px;
  left: 16px;
  color: #555a54;
  font: 7px var(--mono);
  letter-spacing: .13em;
  pointer-events: none;
  transition: opacity .18s ease;
}
.market-chart-stage:hover .market-chart-hint { opacity: .25; }

.market-tooltip {
  position: absolute;
  z-index: 5;
  width: 194px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 12px;
  padding: 13px;
  border: 1px solid #4c504a;
  background: rgba(8,9,8,.96);
  color: #8e928b;
  font: 9px var(--mono);
  pointer-events: none;
}
.market-tooltip[hidden] { display: none; }
.market-tooltip time,
.market-tooltip small { grid-column: 1 / -1; color: #b9bcb6; }
.market-tooltip b { color: #eceee9; font-weight: 400; }

.market-empty {
  position: absolute;
  z-index: 4;
  inset: 0;
  display: grid;
  place-items: center;
  color: #676b64;
  font: 9px var(--mono);
  letter-spacing: .12em;
}
.market-empty[hidden] { display: none; }

.market-stats {
  display: grid;
  grid-template-columns: repeat(5,minmax(0,1fr));
  border-top: 1px solid var(--line);
}
.market-stats > span {
  min-width: 0;
  min-height: 78px;
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 12px;
  border-right: 1px solid var(--line);
}
.market-stats > span:last-child { border-right: 0; }
.market-stats b {
  overflow: hidden;
  text-overflow: ellipsis;
  font: 13px var(--mono);
  color: #e1e3de;
}

@media(max-width:760px) {
  .market-header { min-height: 0; grid-template-columns: 1fr; gap: 28px; padding: 28px 20px; }
  .market-quote { justify-self: stretch; justify-items: start; }
  .market-toolbar { grid-template-columns: 1fr auto; gap: 12px; padding: 12px; }
  .market-toolbar > span { display: none; }
  .market-toolbar a { font-size: 8px; }
  .market-range button { min-width: 38px; padding-inline: 6px; }
  .market-chart-stage { height: 360px; }
  .market-stats { grid-template-columns: 1fr 1fr; }
  .market-stats > span { border-bottom: 1px solid var(--line); }
  .market-stats > span:nth-child(2n) { border-right: 0; }
  .market-stats > span:last-child { grid-column: 1 / -1; border-bottom: 0; }
}

/* Shared fixed protocol chrome */
.staking-shell {
  width: 100%;
  min-height: 100vh;
  margin: 0;
  border: 0;
  display: grid;
  grid-template-columns: minmax(0,1fr);
  grid-template-rows: 72px minmax(0,1fr) auto;
  background: #070807;
  backdrop-filter: none;
}

.staking-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 60;
  width: 100%;
  height: 72px;
  padding: 0;
  display: grid;
  grid-template-columns: 220px minmax(0,1fr) auto;
  align-items: center;
  border-bottom: 1px solid #2b2d2a;
  background: rgba(5,6,5,.9);
  backdrop-filter: blur(18px);
}

.staking-brand {
  height: 100%;
  padding: 0 24px;
  gap: 10px;
}

.staking-brand b {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .1em;
  white-space: nowrap;
}

.staking-contract {
  justify-self: center;
  width: max-content;
  min-width: 0;
}

.staking-actions {
  height: 100%;
  padding-right: 18px;
  justify-self: end;
  display: flex;
  align-items: center;
  gap: 8px;
}

.staking-x-link {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid #4a4d48;
  color: #dfe1dc;
  text-decoration: none;
  font: 500 11px var(--mono);
  letter-spacing: .08em;
}

.staking-x-link:hover,
.staking-x-link:focus-visible {
  border-color: var(--text);
  background: var(--text);
  color: #080908;
  outline: 0;
}

.staking-shell > main {
  grid-column: 1;
  grid-row: 2;
  min-width: 0;
}

.staking-shell > footer {
  grid-column: 1;
  grid-row: 3;
}

.staking-intro,
.staking-workspace,
.staking-market,
.staking-faq { scroll-margin-top: 92px; }

@media(max-width:1100px) {
  .staking-yield-module { grid-template-columns: 1fr; }
  .integrated-stake-panel { border-right: 0; border-bottom: 1px solid var(--line); }
  .staking-calculator-panel { grid-column: 1; }
  .staking-header { grid-template-columns: 190px minmax(0,1fr) auto; }
  .staking-brand { padding-inline: 17px; }
  .staking-contract { min-width: 0; }
}

@media(max-width:920px) {
  .staking-header { grid-template-columns: 1fr auto; }
  .staking-contract { display: none; }
}

@media(max-width:820px) {
  .staking-shell {
    display: block;
    min-height: 100vh;
    padding-top: 62px;
  }
  .staking-header {
    height: 62px;
    grid-template-columns: 1fr auto;
  }
  .staking-brand { padding-inline: 14px; }
  .staking-actions { padding-right: 8px; }
  .staking-shell > main { width: 100%; }
  .staking-shell > footer { width: 100%; }
}

@media(max-width:520px) {
  .staking-brand b span { display: none; }
  .staking-brand svg { width: 23px; }
  .wallet-button { gap: 10px; padding-inline: 10px; }
  .staking-x-link { width: 36px; height: 36px; }
}

/* The lower wallet action is an active connect control until a wallet is linked. */
.stake-submit {
  background: #171917;
  color: #aeb2aa;
  border: 1px solid #343834;
  cursor: pointer;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease,
    transform .2s ease, box-shadow .2s ease;
}
.stake-submit span { transition: transform .2s ease; }
.stake-submit:hover {
  background: var(--text);
  color: #080908;
  border-color: var(--text);
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(0,0,0,.28);
}
.stake-submit:hover span { transform: translate(2px,-2px); }
.stake-submit:active { transform: translateY(0); }
.stake-submit:focus-visible { outline: 1px solid var(--text); outline-offset: 3px; }
.stake-submit:disabled {
  background: #222421;
  color: #6e726b;
  border-color: #2c2f2b;
  cursor: wait;
  transform: none;
  box-shadow: none;
}
.stake-submit[hidden] { display: none; }
.currently-staked {
  display: flex;
  align-items: baseline;
  gap: 7px;
  margin: 11px 0 0;
  color: #72766f;
  font: 9px/1.5 var(--mono);
  letter-spacing: .07em;
}
.currently-staked strong { color: var(--text); font: 11px var(--mono); }
.currently-staked em { color: #8b8f88; font-style: normal; }
.wallet-strip { align-items: center; margin-bottom: 12px; min-width: 0; }
.wallet-strip a {
  min-width: 0;
  max-width: 68%;
  overflow: hidden;
  color: var(--text);
  font: 10px var(--mono);
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.wallet-strip a[href]:hover { text-decoration: underline; text-underline-offset: 3px; }
.wallet-balances {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border: 1px solid var(--line-soft);
  margin: 0 0 24px;
}
.wallet-balances[hidden] { display: none; }
.wallet-balances > span {
  min-width: 0;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 7px 9px;
  padding: 13px 14px;
}
.wallet-balances > span + span { border-left: 1px solid var(--line-soft); }
.wallet-balances small {
  grid-column: 1 / -1;
  color: #666a64;
  font: 8px var(--mono);
  letter-spacing: .1em;
}
.wallet-balances b {
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font: 13px var(--mono);
  text-overflow: ellipsis;
}
.wallet-balances em { color: #777b74; font: 8px var(--mono); font-style: normal; }
.stake-notice { min-height: 0; margin: 7px 0 0; color: #8d918a; }
.stake-notice[hidden] { display: none; }
.staking-brand .brand-logo { width: 22px; height: 38px; object-fit: contain; flex: 0 0 auto; }
@media(max-width:600px) {
  .wallet-balances { grid-template-columns: 1fr; }
  .wallet-balances > span + span { border-left: 0; border-top: 1px solid var(--line-soft); }
  .wallet-strip a { max-width: 58%; }
}
.wallet-dialog-open { overflow: hidden; }
.mobile-wallet-dialog[hidden] { display: none; }
.mobile-wallet-dialog {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: grid;
  place-items: center;
  padding: 18px;
}
.mobile-wallet-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  background: rgba(0,0,0,.82);
  backdrop-filter: blur(7px);
}
.mobile-wallet-panel {
  position: relative;
  width: min(430px,100%);
  border: 1px solid #4a4d48;
  background: #080908;
  box-shadow: 0 24px 80px rgba(0,0,0,.55);
  padding: 22px;
}
.mobile-wallet-panel > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line-soft);
  color: #777b74;
  font: 8px var(--mono);
  letter-spacing: .14em;
}
.mobile-wallet-panel > header button {
  width: 30px;
  height: 30px;
  border: 1px solid var(--line);
  background: transparent;
  color: var(--text);
  cursor: pointer;
}
.mobile-wallet-panel h2 { margin: 24px 0 9px; font-size: 34px; letter-spacing: -.04em; }
.mobile-wallet-panel > p { margin: 0 0 22px; color: #888c85; font-size: 13px; line-height: 1.55; }
.mobile-wallet-options { display: grid; gap: 8px; }
.mobile-wallet-options button {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid var(--line);
  background: transparent;
  color: var(--text);
  padding: 0 16px;
  cursor: pointer;
}
.mobile-wallet-options button:hover,
.mobile-wallet-options button:focus-visible { border-color: var(--text); background: #111311; outline: 0; }
.mobile-wallet-options strong { font: 11px var(--mono); letter-spacing: .08em; }
.mobile-wallet-options small { color: #777b74; font: 8px var(--mono); letter-spacing: .08em; }
.mobile-wallet-panel > footer {
  margin-top: 18px;
  padding-top: 15px;
  border-top: 1px solid var(--line-soft);
  color: #555a53;
  font: 7px/1.5 var(--mono);
  letter-spacing: .08em;
}
@media(max-width:600px) {
  .mobile-wallet-dialog { align-items: end; padding: 0; }
  .mobile-wallet-panel { width: 100%; border-width: 1px 0 0; padding: 20px 18px max(22px,env(safe-area-inset-bottom)); }
}