.rec1-final{
padding:28px 20px;
background:linear-gradient(135deg,rgba(0,255,136,0.08),rgba(0,0,0,0.95));
border:1px solid rgba(0,255,136,0.25);
border-radius:18px;
color:#fff;
max-width:900px;
margin:auto;
font-family:'Segoe UI',sans-serif
}

.rec1-final h2{
text-align:center;
color:#00ff88;
margin-bottom:15px
}

/* PACKAGES - always visible 3 columns */
.packages{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:8px;
margin-bottom:15px
}

.pkg{
background:rgba(0,0,0,0.7);
border:1px solid rgba(0,255,136,0.4);
padding:8px;
border-radius:8px;
cursor:pointer;
text-align:center
}

.pkg-title{
color:#fff;
font-weight:600;
font-size:12px
}

.pkg-rate{
color:#00ff88;
font-size:11px;
margin-top:2px
}

.pkg.active{
background:rgba(0,255,136,0.15);
box-shadow:0 0 8px rgba(0,255,136,0.6)
}

/* SLIDER */
input[type=range]{
width:100%;
accent-color:#00ff88
}

.input-row{
display:flex;
justify-content:space-between;
align-items:center;
margin-top:8px;
font-size:14px
}

.token-block{
display:flex;
align-items:center;
gap:6px
}

#tokenInput{
width:70px;
background:#000;
border:1px solid rgba(0,255,136,0.5);
color:#00ff88;
padding:4px;
border-radius:6px;
text-align:center;
font-weight:bold
}

.rsd-display span{
color:#fff;
font-weight:700;
font-size:16px
}

.rsd-display strong{
color:#fff;
font-weight:800
}

.helper{
font-size:11px;
color:#aaa;
margin-top:4px
}

/* RESULTS */
.results{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:8px;
margin-top:12px
}

.box{
background:rgba(0,0,0,0.7);
padding:8px;
border-radius:8px;
border:1px solid rgba(0,255,136,0.25);
text-align:center
}

.box small{
display:block;
font-size:11px;
color:#ccc;
margin-bottom:2px
}

.box div{
font-weight:bold;
font-size:14px;
color:#00ff88
}

.box strong{
color:#fff
}

.box.highlight{
background:rgba(0,255,136,0.2)
}

.legal-notes{
margin-top:14px;
font-size:11px;
color:#aaa;
text-align:center;
line-height:1.4
}