*{box-sizing:border-box;margin:0;padding:0}
:root{
  --green-900:#1a3a1f;
  --green-700:#2d5016;
  --green-500:#4a7c59;
  --green-300:#8fbc8f;
  --green-100:#e8f5e9;
  --sand-100:#f4e4bc;
  --sand-200:#e8d5a3;
  --brown-700:#5c3d1e;
  --brown-500:#8b6914;
  --gray-900:#1a1a1a;
  --gray-700:#333;
  --gray-500:#666;
  --gray-300:#ccc;
  --gray-100:#f5f5f5;
  --white:#fff;
  --radius:8px;
  --shadow:0 2px 8px rgba(0,0,0,0.08);
  --shadow-lg:0 4px 16px rgba(0,0,0,0.12);
  --max-width:1100px;
}
html{font-size:16px;scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:var(--gray-900);background:var(--white);line-height:1.6}
.container{max-width:var(--max-width);margin:0 auto;padding:0 1.25rem}

.site-header{background:var(--green-900);color:var(--white);padding:0.75rem 0;position:sticky;top:0;z-index:100}
.site-header .container{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:0.5rem;color:var(--white);text-decoration:none;font-weight:700;font-size:1.1rem}
.brand-icon{flex-shrink:0}
.site-nav{display:flex;gap:1.25rem;flex-wrap:wrap}
.site-nav a{color:var(--sand-100);text-decoration:none;font-size:0.9rem}
.site-nav a:hover{color:var(--white)}

.hero{background:linear-gradient(135deg,var(--green-700),var(--green-500));color:var(--white);padding:3rem 0;text-align:center}
.hero h1{font-size:2rem;margin-bottom:0.75rem}
.hero .lead{font-size:1.1rem;max-width:600px;margin:0 auto 1.5rem;opacity:0.9}
.btn-primary{display:inline-block;background:var(--sand-100);color:var(--green-900);padding:0.75rem 1.5rem;border-radius:var(--radius);text-decoration:none;font-weight:600;border:none;cursor:pointer;font-size:1rem}
.btn-primary:hover{background:var(--sand-200)}
.btn-secondary{display:inline-block;background:var(--gray-100);color:var(--gray-700);padding:0.5rem 1rem;border-radius:var(--radius);text-decoration:none;font-weight:500;border:1px solid var(--gray-300);cursor:pointer;font-size:0.85rem}
.btn-secondary:hover{background:var(--gray-300)}

.calculator-section{padding:2.5rem 0;background:var(--gray-100)}
.calc-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start}
@media(max-width:800px){.calc-grid{grid-template-columns:1fr}}
.calc-inputs{background:var(--white);padding:1.5rem;border-radius:var(--radius);box-shadow:var(--shadow)}
.calc-results{background:var(--white);padding:1.5rem;border-radius:var(--radius);box-shadow:var(--shadow);position:sticky;top:5rem}
.field{margin-bottom:1rem}
.field label{display:block;font-weight:600;margin-bottom:0.25rem;font-size:0.9rem}
.field input,.field select{width:100%;padding:0.5rem;border:1px solid var(--gray-300);border-radius:var(--radius);font-size:0.95rem}
.field input:focus,.field select:focus{outline:2px solid var(--green-500);outline-offset:1px}
.field small{display:block;color:var(--gray-500);font-size:0.8rem;margin-top:0.2rem}
.dims-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.75rem}

.results-panel{min-height:200px}
.result-empty{color:var(--gray-500);text-align:center;padding:2rem 0}
.result-row{display:flex;justify-content:space-between;padding:0.5rem 0;border-bottom:1px solid var(--gray-100)}
.result-row:last-child{border-bottom:none}
.result-label{color:var(--gray-500);font-size:0.9rem}
.result-value{font-weight:600;color:var(--green-700)}
.result-highlight{background:var(--green-100);padding:1rem;border-radius:var(--radius);margin:0.75rem 0;text-align:center}
.result-highlight .big{font-size:1.5rem;font-weight:700;color:var(--green-900)}
.result-mix{margin-top:1rem;padding-top:1rem;border-top:2px solid var(--green-300)}
.result-mix h4{margin-bottom:0.5rem;color:var(--green-700)}
.result-mix ul{list-style:none;padding:0}
.result-mix li{padding:0.25rem 0;font-size:0.9rem}
.result-actions{display:flex;gap:0.5rem;margin-top:1rem;flex-wrap:wrap}

.mix-section{padding:2.5rem 0}
.mix-section h2{text-align:center;margin-bottom:0.5rem}
.section-intro{text-align:center;color:var(--gray-500);max-width:600px;margin:0 auto 2rem}
.mix-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem}
.mix-card{background:var(--white);border:1px solid var(--gray-300);border-radius:var(--radius);padding:1.25rem}
.mix-card h3{color:var(--green-700);margin-bottom:0.75rem;font-size:1.05rem}
.mix-card ul{list-style:none;padding:0;margin-bottom:0.75rem}
.mix-card li{padding:0.2rem 0;font-size:0.9rem}
.mix-note{font-size:0.85rem;color:var(--gray-500);font-style:italic}

.tips-section{padding:2.5rem 0;background:var(--gray-100)}
.tips-section h2{text-align:center;margin-bottom:1.5rem}
.tips-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.25rem;margin-bottom:2rem}
.tip-card{background:var(--white);padding:1.25rem;border-radius:var(--radius);box-shadow:var(--shadow)}
.tip-card h3{color:var(--green-700);margin-bottom:0.5rem;font-size:1rem}
.tip-card p{font-size:0.9rem;color:var(--gray-700)}
.scenario-box{background:var(--sand-100);padding:1.25rem;border-radius:var(--radius);margin-bottom:1.5rem;border-left:4px solid var(--brown-500)}
.scenario-box h3{color:var(--brown-700);margin-bottom:0.5rem}
.scenario-box p{font-size:0.9rem}
.assumptions-box{background:var(--white);padding:1.25rem;border-radius:var(--radius);box-shadow:var(--shadow)}
.assumptions-box h3{color:var(--gray-700);margin-bottom:0.5rem;font-size:1rem}
.assumptions-box ul{padding-left:1.25rem}
.assumptions-box li{font-size:0.9rem;margin-bottom:0.25rem}

.site-footer{background:var(--green-900);color:var(--sand-100);padding:1.5rem 0;text-align:center}
.site-footer a{color:var(--sand-100)}
.site-footer a:hover{color:var(--white)}
.footer-nav{display:flex;justify-content:center;gap:1rem;margin:0.5rem 0;flex-wrap:wrap}
.small{font-size:0.8rem;opacity:0.7;margin-top:0.5rem}

@media print{
  .site-header,.site-footer,.result-actions,.btn-primary,.btn-secondary{display:none}
  .calc-results{position:static}
  body{font-size:12pt}
}

@media(max-width:600px){
  .hero h1{font-size:1.5rem}
  .hero .lead{font-size:1rem}
  .dims-grid{grid-template-columns:1fr}
  .calc-inputs,.calc-results{padding:1rem}
}



/* Factory-injected deployment helpers. The AI owns the site design above this block. */
.ad-unit {
  width: min(100%, 720px);
  min-height: 120px;
  margin: 24px auto;
  display: block;
}

.legal-page {
  width: min(900px, calc(100% - 32px));
  margin: 40px auto;
}

.factory-fallback-nav {
  width: min(900px, calc(100% - 32px));
  margin: 24px auto 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  align-items: center;
  font-size: 0.95rem;
}

.factory-fallback-nav a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
}