:root{--soil:#3b2b22;--leaf:#315845;--dark:#203d30;--paper:#f8f6ef;--white:#fffefa;--ink:#24231f;--muted:#68675f;--line:#ccc9bd;--yellow:#e3b94d;--warn:#9b572c;--serif:'Noto Serif Bengali',serif;--sans:'Noto Sans Bengali',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.65 var(--sans)}button,input,summary{font:inherit}.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;z-index:99;background:#fff;padding:8px 12px}.topbar{min-height:68px;padding:0 clamp(18px,5vw,68px);display:flex;align-items:center;justify-content:space-between;background:var(--white);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--dark);font:700 19px/1.15 var(--serif)}.brand small{display:block;font:500 11px/1.4 var(--sans);color:var(--muted);margin-top:2px}.brandmark{width:34px;height:38px;border-radius:50% 50% 46% 8%;background:var(--dark);color:#fff;display:grid;place-items:center;font-size:18px;transform:rotate(-4deg)}.topbar nav{display:flex;height:68px}.navlink,.lang,.profile,.menu{border:0;background:transparent;cursor:pointer}.navlink{padding:0 15px;border-bottom:3px solid transparent;color:#57594f;font-weight:600;font-size:14px}.navlink:hover,.navlink.active{color:var(--dark);border-bottom-color:var(--dark)}.actions{display:flex;align-items:center;gap:9px}.lang{border:1px solid var(--line);padding:6px 9px;font-size:12px}.profile{width:34px;height:34px;border-radius:50%;background:var(--soil);color:#fff}.menu{display:none;font-size:23px}.view{display:none;min-height:calc(100vh - 68px)}.view.active{display:block}
.hero{max-width:1280px;margin:auto;min-height:540px;padding:62px clamp(22px,6vw,82px);display:grid;grid-template-columns:1.05fr .85fr;align-items:center;gap:7vw;position:relative}.hero:after{content:'মাঠ নোট · ০১';position:absolute;left:clamp(22px,6vw,82px);bottom:18px;font-size:11px;letter-spacing:.18em;color:#918f84}.eyebrow{letter-spacing:.08em;font-weight:700;font-size:12px;color:var(--warn)}.hero h1{font:600 clamp(38px,4.6vw,62px)/1.2 var(--serif);letter-spacing:-.025em;margin:14px 0 19px;color:var(--soil)}.hero h1 em{font-style:normal;color:var(--leaf)}.hero-copy>p{font-size:17px;line-height:1.8;color:#55564f;max-width:590px}.hero-actions{display:flex;gap:10px;margin:26px 0}.primary,.secondary{padding:11px 17px;border:1px solid var(--dark);font-weight:700;cursor:pointer;transition:.18s}.primary{background:var(--dark);color:#fff}.primary:hover{background:#142b20}.secondary{background:transparent;color:var(--dark)}.secondary:hover{background:#e8ece2}.trust{display:flex;color:#5e6158;font-size:13px}.trust span{padding-right:16px;margin-right:16px;border-right:1px solid var(--line)}.trust span:last-child{border:0}.soil-card{background:var(--white);padding:0;border:1px solid #aaa79b;box-shadow:12px 12px 0 #d9d5c9;max-width:500px}.field-top{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid var(--line)}.field-top span,.score span,.status span{display:block;font-size:12px;color:var(--muted)}.field-top strong{font:600 16px var(--serif)}.field-top button{border:0;background:transparent}.field-record{display:grid;grid-template-columns:1fr 1.3fr;padding:14px 18px;background:repeating-linear-gradient(0deg,#fffefa 0,#fffefa 31px,#e7e3d7 32px);font-size:13px;line-height:32px}.field-record span{color:var(--muted)}.score-row{display:flex;align-items:center;justify-content:space-between;padding:17px 18px 13px;border-top:1px solid var(--line)}.score strong{font-size:27px}.score small{font-size:13px}.status{display:flex;align-items:center;gap:8px}.status i{width:8px;height:8px;border-radius:50%;background:#58835e}.mini-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}.mini-grid>div{padding:12px 15px;border-right:1px solid var(--line)}.mini-grid>div:last-child{border:0}.mini-grid span,.mini-grid small{display:block;font-size:11px;color:var(--muted)}.mini-grid strong{font-size:17px}.demo-note{font-size:11px;color:var(--muted);padding:9px 15px;margin:0;border-top:1px solid var(--line)}
.quick-strip{max-width:1120px;margin:5px auto 0;border-top:2px solid var(--soil);border-bottom:1px solid var(--line);padding:18px 4px;display:flex;justify-content:space-between;align-items:center}.quick-strip>div{display:flex;gap:10px;align-items:center}.quick-strip p,.quick-strip small{margin:0;display:block}.quick-strip small{color:var(--muted);font-size:12px}.stepno{display:grid;place-items:center;border:1px solid var(--soil);width:29px;height:29px;border-radius:50%;font-weight:700;font-size:13px}.quick-strip>b{color:#a8a599}.section{padding:78px clamp(22px,6vw,82px);max-width:1280px;margin:auto}.section-head,.page-head,.panel-head{display:flex;justify-content:space-between;align-items:end}.section h2,.page-head h1{font:600 clamp(30px,3.4vw,44px)/1.25 var(--serif);margin:7px 0;color:var(--soil)}.text-btn,.panel-head button{border:0;background:none;color:var(--dark);font-weight:700;cursor:pointer}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:28px;border-block:1px solid var(--line)}.feature-grid article{padding:27px 28px 25px 0;margin-right:28px;border-right:1px solid var(--line)}.feature-grid article:last-child{border:0;margin:0}.icon{width:42px;height:32px;display:grid;place-items:center;border-left:4px solid var(--yellow);background:#efede5;font-weight:700;font-size:13px}.feature-grid h3{font:600 20px var(--serif);margin:16px 0 7px}.feature-grid p,.guide-grid p{color:var(--muted);line-height:1.75}.page-head{padding:50px clamp(22px,6vw,82px) 25px;max-width:1280px;margin:auto;border-bottom:1px solid var(--line)}.page-head p{color:var(--muted);font-size:16px;margin-bottom:4px}.draft{color:var(--muted);font-size:13px}
.test-layout{display:grid;grid-template-columns:245px 1fr;max-width:1180px;margin:34px auto 70px;padding:0 22px}.steps{border:1px solid var(--line);border-right:0;padding:8px;background:#efede5;height:max-content}.steps button{width:100%;border:0;border-bottom:1px solid #d8d5ca;background:transparent;display:flex;gap:11px;text-align:left;padding:13px 10px;cursor:pointer}.steps button.current{background:var(--white);border-left:3px solid var(--dark)}.steps b{width:27px;height:27px;border:1px solid #a9aaa2;border-radius:50%;display:grid;place-items:center;font-size:12px}.steps .current b,.steps .done b{background:var(--dark);color:#fff}.steps span{font-weight:700;font-size:14px}.steps small{display:block;font-weight:400;color:var(--muted);font-size:12px}.test-panel{background:var(--white);border:1px solid var(--line);padding:clamp(24px,4vw,48px)}.progress{height:4px;background:#e0ded5;margin-bottom:18px}.progress span{display:block;height:100%;background:var(--yellow);transition:.3s}.step-label{color:var(--muted);font-size:13px}.test-panel h2{font:600 28px/1.4 var(--serif);margin:9px 0 4px}.test-panel>p{color:var(--muted)}.color-options{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:24px 0 10px}.color-options input{position:absolute;opacity:0}.color-options label{border:1px solid var(--line);padding:12px;cursor:pointer;display:flex;align-items:center;gap:9px}.color-options label:has(input:checked){outline:2px solid var(--dark);background:#f0f3eb}.color-options i{width:34px;height:34px;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 2px #ffffff73}.color-options span,.color-options small{display:block}.color-options small{color:var(--muted);font-size:11px}.unknown{border:0;background:none;color:var(--dark);font-weight:700;text-decoration:underline;cursor:pointer}.tip{display:flex;gap:11px;background:#f1eee5;border-left:4px solid var(--yellow);padding:14px 16px;margin:26px 0}.tip p{margin:0;color:#51534c}.form-nav{border-top:1px solid var(--line);padding-top:18px;display:flex;justify-content:space-between}
.stats{max-width:1180px;margin:30px auto 18px;padding:0 22px;display:grid;grid-template-columns:repeat(3,1fr);gap:1px}.stats div{background:var(--white);border:1px solid var(--line);padding:17px 20px}.stats span{color:var(--muted);font-size:13px}.stats strong{display:block;font-size:24px;margin-top:2px;color:var(--soil)}.dashboard-grid{max-width:1180px;margin:auto;padding:0 22px;display:grid;grid-template-columns:1.2fr .8fr;gap:14px}.panel{background:var(--white);padding:21px;border:1px solid var(--line)}.panel h2{font:600 21px var(--serif);margin:0}.field-item{display:flex;align-items:center;gap:13px;border-top:1px solid var(--line);padding:16px 0}.field-item:first-of-type{margin-top:14px}.field-icon{width:48px;height:38px;display:grid;place-items:center;border-left:4px solid #819a68;background:#edf0e7;font-size:13px}.field-icon.mustard{border-color:#d5a93d;background:#f5efdf}.field-item h3,.field-item p{margin:0}.field-item p{color:var(--muted);font-size:13px}.pill{margin-left:auto;padding:4px 8px;font-size:11px;border:1px solid}.pill.good{color:#306a35}.pill.warn{color:#8d501e}.tasks{list-style:none;padding:0;margin:14px 0}.tasks li{display:flex;gap:11px;border-top:1px solid var(--line);padding:14px 0}.tasks input{width:18px}.tasks label small{display:block;color:var(--muted);font-size:12px}.notice{max-width:1136px;margin:18px auto 70px;background:#f4ead9;border-left:4px solid var(--warn);padding:15px 19px}.notice p{margin:3px 0 0}
.guide-grid{max-width:1180px;margin:30px auto 0;padding:0 22px;display:grid;grid-template-columns:repeat(2,1fr)}.guide-grid article{background:var(--white);border:1px solid var(--line);padding:25px}.guide-grid article span{font-weight:700;font-size:13px;color:var(--warn)}.guide-grid h2{font:600 22px var(--serif);margin:10px 0 4px}.faq{max-width:860px;margin:60px auto;padding:0 22px 70px}.faq>h2{font:600 30px var(--serif)}.faq details{background:var(--white);border-top:1px solid var(--line);padding:16px 4px}.faq details:last-child{border-bottom:1px solid var(--line)}.faq summary{font-weight:700;cursor:pointer}.faq details p{color:var(--muted);margin:10px 0 0}.toast{position:fixed;right:20px;bottom:20px;background:var(--soil);color:#fff;padding:12px 16px;opacity:0;transform:translateY(15px);transition:.2s;pointer-events:none;z-index:50}.toast.show{opacity:1;transform:none}footer{background:var(--dark);color:#dbe4dc;padding:30px clamp(22px,6vw,82px);display:flex;align-items:center;justify-content:space-between}footer .brand{color:#fff}footer .brandmark{background:#fff;color:var(--dark)}footer p,footer>span{color:#b6c0b8;font-size:13px}
@media(max-width:900px){.topbar nav{display:none;position:absolute;top:68px;left:0;right:0;background:var(--white);padding:8px 18px;height:auto}.topbar nav.open{display:grid}.navlink{padding:12px;text-align:left}.menu{display:block}.profile{display:none}.hero{grid-template-columns:1fr;padding-top:48px}.soil-card{max-width:590px}.quick-strip{margin:0 20px;display:grid;grid-template-columns:1fr 1fr;gap:14px}.quick-strip>b{display:none}.test-layout{grid-template-columns:1fr}.steps{display:flex;overflow:auto;border-right:1px solid var(--line)}.steps button{min-width:165px}.dashboard-grid{grid-template-columns:1fr}}@media(max-width:650px){.hero{padding:38px 19px 55px}.hero h1{font-size:38px}.hero-actions{flex-direction:column}.hero-actions button{width:100%}.trust{display:grid;gap:5px}.trust span{border:0}.soil-card{box-shadow:7px 7px 0 #d9d5c9}.quick-strip{grid-template-columns:1fr}.section{padding:58px 19px}.feature-grid,.stats,.guide-grid{grid-template-columns:1fr}.feature-grid article{border-right:0;border-bottom:1px solid var(--line);margin:0;padding:22px 0}.section-head,.page-head{align-items:flex-start;gap:14px;flex-direction:column}.color-options{grid-template-columns:1fr 1fr}.dashboard-grid,.stats{padding:0 14px}.test-layout{padding:0 14px}.test-panel{padding:22px 16px}.field-item{flex-wrap:wrap}.pill{margin-left:61px}.page-head{padding:38px 19px 22px}.page-head h1{font-size:34px}footer{flex-direction:column;align-items:flex-start;gap:14px}}
/* Home page guide card */
.home-guide-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 24px;
}

.home-guide-text {
  margin: 0;
  max-width: 520px;
  color: #5f655f;
  font-size: 1rem;
  line-height: 1.8;
}

.home-guide-card .mini-grid {
  width: 100%;
}

.home-guide-card .wide {
  width: 100%;
  min-height: 54px;
}

.home-guide-card .demo-note {
  margin: 0;
  text-align: center;
}