:root {
  --text-primary: #1B1B1B;
  --text-secondary: #7a6f66;
  --accent: #93280a;
  --valid: #3f6b3f;
  --button-bg: #1B1B1B;
  --button-bg-hover: #060606;
  --divider: rgba(27, 27, 27, 0.12);
  --card-bg: #FDFAF9;
}
*{box-sizing:border-box;}
html, body { margin:0; padding:0; width:100%; }
body{
  min-height:100vh;
  background:#F7F3EB;
  color:var(--text-primary);
  font-family:'Mona Sans', sans-serif;
  font-kerning:normal;
}
.container{
  width:100%;
  max-width:620px;
  margin:0 auto;
  padding:56px 24px 40px;
  box-sizing:border-box;
}
.content{animation:riseIn .7s ease both;}
@keyframes riseIn{ from{opacity:0;transform:translateY(8px);} to{opacity:1;transform:translateY(0);} }
@media (prefers-reduced-motion: reduce){ .content{animation:none;} }



.headerText{
  font-size:40px;
  line-height:1.1em;
  font-weight:800;
  letter-spacing:-0.02em;
  word-break:break-word;
}
.bodyText{
  margin-top:16px;
  font-size:17px;
  line-height:1.55em;
  color:var(--text-secondary);
  max-width:52ch;
}

form{display:flex;gap:10px;margin-top:32px;flex-wrap:wrap;align-items:flex-start;}
.inputWrap{position:relative;flex:1;min-width:220px;}
.inputWrap input[type=text]{width:100%;padding-right:44px;}
.validIcon{
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%) scale(0.7);
  width:20px;
  height:20px;
  opacity:0;
  transition:opacity .15s ease, transform .15s ease;
  pointer-events:none;
}
.validIcon.show{opacity:1;transform:translateY(-50%) scale(1);}
.hp-field{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;overflow:hidden;}
input[type=text]{
  flex:1;
  min-width:220px;
  font-family:'JetBrains Mono', monospace;
  font-size:16px;
  padding:15px 16px;
  border:1px solid var(--divider);
  border-radius:8px;
  background:#fff;
  color:var(--text-primary);
  outline:none;
  transition:border-color .2s ease;
}
input[type=text]:focus{border-color:var(--text-primary);}
button{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-family:'Mona Sans', sans-serif;
  font-weight:700;
  font-size:16px;
  padding:15px 26px;
  border:none;
  border-radius:8px;
  color:#fff;
  background:var(--button-bg);
  cursor:pointer;
  transition:background-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
button:hover{background:var(--button-bg-hover);transform:translateY(-1px);box-shadow:0 10px 24px rgba(27,27,27,.22);}
button:active{transform:translateY(0);}
button:disabled{opacity:.5;cursor:default;transform:none;box-shadow:none;}

#result{display:none;margin-top:36px;}

.verdict{
  display:flex;
  align-items:center;
  gap:14px;
  padding:18px 20px;
  border-radius:10px;
  margin-bottom:28px;
  background:var(--card-bg);
  border:1px solid var(--divider);
  border-left:3px solid var(--text-secondary);
}
.verdict.valid{border-left-color:var(--valid);}
.verdict.unsigned{border-left-color:var(--text-secondary);}
.verdict.broken,.verdict.error{border-left-color:var(--accent);}
.vdot{width:12px;height:12px;border-radius:50%;flex-shrink:0;background:var(--text-secondary);}
.valid .vdot{background:var(--valid);}
.broken .vdot,.error .vdot{background:var(--accent);}
.verdict-text .label{
  font-size:11px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--text-secondary);
  margin-bottom:3px;
}
.verdict-text .headline{font-size:17px;font-weight:700;}

.chain{display:flex;align-items:center;justify-content:center;gap:0;margin:0 0 32px;}
.node{display:flex;flex-direction:column;align-items:center;gap:8px;width:100px;}
.node .label{font-size:12px;color:var(--text-secondary);}
.lock{width:30px;height:30px;}
.link{flex:1;height:1.5px;background:var(--divider);position:relative;top:-13px;}
.link.on{background:var(--text-primary);}
.link.dashed{background:repeating-linear-gradient(90deg, var(--text-secondary) 0 6px, transparent 6px 12px);}
.link.off{background:var(--accent);}

.panel{
  background:var(--card-bg);
  border:1px solid var(--divider);
  border-radius:10px;
  padding:20px 22px;
  margin-bottom:16px;
  overflow-x:auto;
}
.panel h3{
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--accent);
  margin:0 0 14px;
}
.rec{
  font-family:'JetBrains Mono', monospace;
  font-size:13px;
  color:var(--text-primary);
  line-height:1.7;
  white-space:pre-wrap;
}
.rec .k{color:var(--text-secondary);}
.empty{font-family:'JetBrains Mono', monospace;font-size:13px;color:var(--text-secondary);}

.faq{
  margin-top:56px;
  padding-top:36px;
  border-top:1px solid var(--divider);
}
.faqHeading{
  font-size:22px;
  font-weight:800;
  letter-spacing:-0.01em;
  margin:0 0 8px;
}
.faqItem{
  border-bottom:1px solid var(--divider);
  padding:18px 0;
}
.faqItem summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  cursor:pointer;
  font-weight:700;
  font-size:16px;
  list-style:none;
}
.faqItem summary::-webkit-details-marker{display:none;}
.faqIcon{
  flex-shrink:0;
  width:20px;
  height:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--accent);
  font-weight:700;
  font-size:18px;
  transition:transform .2s ease;
}
.faqItem[open] .faqIcon{transform:rotate(45deg);}
.faqItem p{
  margin:12px 0 0;
  font-size:15px;
  line-height:1.6;
  color:var(--text-secondary);
  max-width:56ch;
}
.faqItem code{
  font-family:'JetBrains Mono', monospace;
  font-size:13px;
  background:var(--card-bg);
  border:1px solid var(--divider);
  border-radius:4px;
  padding:1px 6px;
}

.footerRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-top:40px;
}
.footerLeft{display:flex;flex-direction:column;gap:6px;}
.logo{width:40px;height:auto;display:block;flex-shrink:0;}
.privacyLink{font-size:13px;color:var(--text-secondary);}
.privacyLink a{color:var(--text-secondary);}
a{color:var(--text-primary);transition:opacity .2s ease;}
a:hover{opacity:.85;}

@media (max-width:768px){
  .headerText{font-size:30px;}
  .bodyText{font-size:15px;}
  button{padding:14px 22px;font-size:15px;}
  .logo{width:26px;}
  .footerRow{flex-direction:column-reverse;align-items:flex-start;gap:12px;}
}