/* ===== SAVING GOAL ===== */

.saving-date{
width:100%;
height:66px;
padding:0 14px;
border:1px solid #d9e4f2;
border-radius:16px;
font-size:1.2rem;
font-weight:800;
background:#fff;
font-family:inherit;
color:#101828;
box-sizing:border-box;
-webkit-appearance:none;
appearance:none;
transition:.15s;
}

.saving-date:focus{
outline:none;
border-color:#2563eb;
box-shadow:0 0 0 4px rgba(37,99,235,.1);
}

.saving-choice{
display:flex;
gap:12px;
flex-wrap:wrap;
margin:14px 0 4px;
}

.saving-choice label{
display:flex;
align-items:center;
gap:8px;
padding:12px 14px;
background:#f8fbff;
border:1px solid #dceeff;
border-radius:14px;
font-weight:800;
cursor:pointer;
color:#1e3a8a;
}

.saving-choice input{width:auto;height:auto}

.saving-result{
background:transparent;
border-radius:0;
padding:0;
text-align:center;
font-size:1rem;
line-height:1.9;
font-weight:400;
color:#344054;
}

.saving-section{
background:#fff;
border-radius:24px;
padding:25px;
margin-bottom:16px;
border:1px solid #e8edf5;
box-shadow:0 8px 20px rgba(16,24,40,.05);
}

.saving-section:last-child{margin-bottom:0}

.saving-title{
font-size:1.25rem;
line-height:1.35;
font-weight:900;
color:#2563eb;
margin-bottom:12px;
text-align:center;
}

.saving-main{
font-size:1.9rem;
line-height:1.3;
font-weight:900;
color:#2563eb;
margin:12px 0;
text-align:center;
}

.saving-sub{
font-size:.95rem;
line-height:1.9;
font-weight:500;
color:#667085;
text-align:center;
}

.saving-info{
margin-top:0;
background:none;
border:none;
padding:0;
text-align:left;
font-size:1.02rem;
line-height:1.85;
color:#344054;
}

.saving-info b{color:#2563eb;font-weight:880}

.saving-compare{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:12px;
margin-top:16px;
}

.saving-compare-card{
background:#fff;
border:1px solid #dceeff;
border-radius:16px;
padding:16px;
text-align:center;
box-sizing:border-box;
}

.saving-compare-card span{
display:block;
font-size:.95rem;
line-height:1.45;
font-weight:700;
color:#667085;
margin-bottom:8px;
}

.saving-compare-card b{
display:block;
font-size:1.15rem;
line-height:1.45;
font-weight:900;
color:#2563eb;
}

.saving-note{font-size:1rem;line-height:1.8;font-weight:500;color:#667085}
.saving-list{display:inline-block;text-align:left;line-height:2}

.saving-progress{
width:100%;
height:18px;
background:#eaf2ff;
border-radius:999px;
overflow:hidden;
margin:14px 0 10px;
}

.saving-progress-bar{height:100%;background:#2563eb;border-radius:999px;width:0%}
.saving-progress-text{font-size:1rem;font-weight:800;color:#2563eb;text-align:center}

@media(max-width:768px){
.saving-date{height:71px;font-size:1.35rem}
.saving-choice{display:grid;grid-template-columns:1fr;gap:10px}
.saving-choice label{padding:14px;font-size:1.08rem}
.saving-result{padding:0;margin-left:0;margin-right:0;border-radius:0}
.saving-section{padding:15px;margin-bottom:14px;border-radius:20px}
.saving-title{font-size:1.28rem;line-height:1.4}
.saving-main{font-size:1.8rem;line-height:1.3}
.saving-sub{font-size:1rem;font-weight:800;color:#000;line-height:1.75}
.saving-info{font-size:.98rem;line-height:1.8}
.saving-compare{grid-template-columns:1fr;gap:10px}
.saving-compare-card{padding:14px}
.saving-compare-card b{font-size:1.2rem}
}

/* Warm input/output hierarchy */
.percent-card.card-1{
--accent:#d97706;
border-color:#f6e1c8;
border-top-color:#d97706;
}

.percent-card.card-1 .card-num{box-shadow:0 4px 10px rgba(217,119,6,.45)}

.percent-card.card-1 .percent-input:focus,
.percent-card.card-1 .saving-date:focus{
border-color:#d97706;
box-shadow:0 0 0 4px rgba(217,119,6,.14);
}

.percent-card.card-1 .percent-addon{background:#f9e9d7;color:#9a5a16}

.percent-card.card-1 .saving-choice label{
background:#fdf7f0;
border-color:#f4d9b9;
color:#7a4918;
}

body .percent-card.card-1 .result-coffee.result-coffee{
background:#fbf1e6;
border:1px solid #f4d9b9;
color:#4a3524;
box-shadow:none;
}

.saving-section{background:#fffaf5;border-color:#ecd7c3;box-shadow:none}
.saving-title{color:#9a5a16}
.saving-main{color:#c96f05}
.saving-sub,.saving-info,.saving-note{color:#5a4634}
.saving-info b,.saving-compare-card b{color:#c96f05}
.saving-compare-card{background:#fffdf9;border-color:#e8cfb7}
.saving-progress{background:#f3dfcc}
.saving-progress-bar{background:#d97706}
.saving-progress-text{color:#9a5a16}