.tool-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(320px,.7fr);gap:24px;align-items:start;margin-top:24px}
.tool-panel{padding:26px}
.result-panel{padding:24px;position:sticky;top:96px}

.section-title{margin:0 0 8px;font-size:1.35rem;letter-spacing:-.02em}
.section-copy{margin:0;color:var(--text-2);line-height:1.65}

.controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:22px 0 18px}
.field{display:grid;gap:8px}
.field label{font-size:.92rem;color:var(--text-1)}
.select,.input{width:100%;padding:13px 14px;border-radius:16px;border:1px solid rgba(255,255,255,.08);background:rgba(7,13,20,.68);color:#f5fbff;outline:none}
.select:focus,.input:focus{border-color:rgba(125,211,252,.35);box-shadow:0 0 0 4px rgba(125,211,252,.08)}

.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:16px}
.mini-card,.result-card{padding:16px;border-radius:18px;border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.03)}
.mini-card h3{margin:0 0 8px;font-size:1rem}
.mini-card p{margin:0;color:var(--text-2);line-height:1.65}

.button-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
.btn{border:0;border-radius:16px;padding:13px 18px;font-weight:700;cursor:pointer;transition:transform .18s ease, box-shadow .18s ease}
.btn:hover{transform:translateY(-1px)}
.btn-primary {
  color: #04120a;
  background: var(--accent);
  box-shadow: 0 14px 34px rgba(79,255,176,.22);
}
.btn-secondary {
  color: var(--accent);
  background: rgba(79,255,176,.07);
  border: 1px solid rgba(79,255,176,.25);
}
.btn-secondary:hover {
  background: rgba(79,255,176,.13);
  border-color: rgba(79,255,176,.45);
}

.inline-note{margin-top:16px;padding:16px 18px;border-radius:18px;border:1px solid rgba(125,211,252,.12);background:rgba(125,211,252,.05);color:var(--text-1);line-height:1.7}
.warning-note,.tool-disclaimer{margin-top:14px;padding:16px 18px;border-radius:18px;line-height:1.7}
.warning-note{border:1px solid rgba(255,214,102,.22);background:rgba(255,214,102,.06);color:#f3f2dd}
.tool-disclaimer{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);color:var(--text-2);font-size:.94rem}

.result-title{margin:0 0 8px;font-size:1.4rem}
.result-sub{margin:0 0 18px;color:var(--text-2);line-height:1.65}
.result-main{padding:18px;border-radius:18px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);margin-bottom:16px}
.result-main-label,.result-label{margin:0 0 8px;color:var(--text-2);font-size:.9rem}
.result-main-value{margin:0;font-size:1.05rem;line-height:1.7;white-space:pre-wrap;word-break:break-word}
.result-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:16px}
.result-value{margin:0;font-size:1rem;line-height:1.5}
.steps-view{white-space:pre-wrap;line-height:1.75;color:#e6f2ff;max-height:380px;overflow:auto}

@media (max-width:980px){
  .tool-layout{grid-template-columns:1fr}
  .result-panel{position:relative;top:auto}
  .controls{grid-template-columns:1fr 1fr}
}

@media (max-width:760px){
  .tool-panel,.result-panel{padding:20px}
  .controls,.cards,.result-grid{grid-template-columns:1fr}
}
.result-text {
  color: var(--text-1);
  line-height: 1.6;
}

.result-text strong {
  color: var(--text-0);
}