/* Shared proportional frame; preserves the existing modules and visual assets. */
#app{width:100%;max-width:860px;margin-inline:auto;box-sizing:border-box}
#app :is(.farm-content,.fert-content,.blocks-content,.task-content,.crop-content,.settings-content,.approvals-content,.chemical-master-content,.chemical-store-content,.parity-activities,.parity-operators,.parity-block-reports,.parity-block-record,.parity-usage){width:100%;max-width:740px;margin-inline:auto;box-sizing:border-box}
#app .dashboard-content{max-width:820px;box-sizing:border-box}
#app :is(.farm-header,.fert-header,.dashboard-header) h1{min-width:0;overflow-wrap:anywhere;line-height:1.3}
#app :is(.farm-row,.chemical-list-row,.fert-program-block,.fert-instruction-card,.fert-application-card,.parity-operator-row){box-sizing:border-box}
#app :is(.farm-row,.fert-record-copy,.chemical-list-copy,.farm-hero-copy){min-width:0;overflow-wrap:anywhere}
#app dialog{box-sizing:border-box;max-width:min(720px,calc(100vw - 24px));max-height:calc(100dvh - 24px)}
#app dialog :is(input,select,textarea){max-width:100%;box-sizing:border-box}
#app dialog :is(main,.labour-analysis-body){min-width:0}
#app .dashboard-tile{min-width:0;height:112px;padding:10px 6px}
#app .dashboard-tile strong{font-size:12px;line-height:1.25;text-align:center;overflow-wrap:anywhere}
#app .dashboard-tile img{width:60px;height:60px}
#app .dashboard-labels strong{font-size:12px}#app .dashboard-labels>span{font-size:14px}
@media(min-width:861px){
 #app{box-shadow:0 0 28px #173a2412;border-inline:1px solid #e1e7df}
 #app :is(.farm-content,.fert-content,.blocks-content,.task-content,.crop-content){padding-block:20px}
}
@media(max-width:600px){
 #app{max-width:none}
 #app :is(.farm-content,.fert-content,.blocks-content,.task-content,.crop-content,.chemical-store-content,.parity-activities,.parity-operators,.parity-block-reports,.parity-block-record,.parity-usage){padding-inline:12px}
 #app dialog{max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}
 /* 16px field text also prevents Safari's focus zoom on iPhone. */
 #app dialog :is(input:not([type=checkbox]):not([type=radio]),select,textarea){font-size:16px}
 #app .dashboard-tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
 #app .dashboard-tile{height:102px;border-radius:16px}
 #app .dashboard-tile img{width:56px;height:56px}
 #app .dashboard-tile strong{font-size:12px}
 #app .dashboard-labels strong{font-size:11px}#app .dashboard-labels>span{font-size:12px}
 #app .farm-hero-copy{padding:10px}
}
@media(max-width:360px){
 #app .dashboard-glance{grid-template-columns:minmax(0,1fr)}
 #app .dashboard-metric:nth-child(odd):not(.dashboard-wide){border-right:0}
 #app .dashboard-wide{grid-column:auto}
 #app :is(.fert-list-controls,.chemical-list-controls){flex-wrap:wrap}
}
/* Desktop type scale matches the compact module screens; phone scale is retained. */
@media(min-width:601px){
 #app :is(.chemical-store-content,.fert-content:has(.fert-store-hero),.parity-activities){font-size:14px}
 #app :is(.chemical-store-hero,.fert-store-hero){height:156px}
 #app :is(.chemical-store-hero,.fert-store-hero) h2{font-size:22px}
 #app :is(.chemical-store-hero,.fert-store-hero) p{font-size:14px}
 #app :is(.chemical-store-quick,.fert-store-quick),#app :is(.chemical-store-quick,.fert-store-quick)>button{height:104px}
 #app :is(.chemical-store-quick,.fert-store-quick) strong{font-size:14px}
 #app :is(.chemical-store-quick,.fert-store-quick) small{font-size:12px}
 #app .chemical-list-copy>strong,#app .fert-store-product-card>.fert-record-copy>strong{font-size:17px}
 #app .chemical-list-copy>small,#app .fert-store-product-card>.fert-record-copy>span,#app .fert-store-product-card>.fert-record-copy>small{font-size:13px}
 #app .chemical-store-list-balance>strong,#app .fert-store-product-stock>strong{font-size:18px!important}
 #app .parity-activities>button:not(.vineyard-job):not(.vineyard-legacy){font-size:16px;min-height:48px;padding:12px;margin-bottom:10px}
 #app .parity-activities h2{font-size:17px;margin:20px 4px 12px}
 #app .parity-activities .vineyard-job{padding:14px;margin-bottom:12px;gap:7px}
 #app .parity-activities .vineyard-block{font-size:16px}
 #app .parity-activities .vineyard-name{font-size:21px}
 #app .parity-activities .vineyard-status,#app .parity-activities .vineyard-open{font-size:14px}
 #app .parity-activities .vineyard-metrics{padding:12px 8px}
 #app .parity-activities .vineyard-metrics strong{font-size:18px}
 #app .parity-activities .vineyard-metrics small{font-size:12px}
}
@media(min-width:601px){
 #app :is(.parity-block-reports,.parity-block-record,.parity-usage,.parity-operators){font-size:14px}
 #app :is(.parity-block-reports,.parity-block-record)>.parity-action,#app .parity-block-reports>button:not(.chemical-list-row),#app .parity-block-record>button{font-size:16px;min-height:48px;padding:12px;margin-bottom:10px}
 #app .parity-report-hero{padding:12px;gap:12px;margin-bottom:14px}
 #app .parity-report-hero .farm-hero-image{width:86px;height:78px}
 #app .parity-report-hero h2,#app .parity-report-intro h2{font-size:20px}
 #app .parity-report-hero p,#app .parity-report-intro p{font-size:14px}
 #app .parity-block-reports>p{padding:16px}
 #app .parity-block-reports .chemical-list-row{padding:14px;gap:12px;margin-bottom:10px}
 #app .parity-block-reports .chemical-list-copy strong{font-size:18px}
 #app .parity-block-reports .chemical-list-copy span{font-size:15px}
 #app .parity-block-reports .chemical-list-copy small{font-size:12px}
 #app .parity-report-intro{padding:14px;grid-template-columns:48px 1fr;gap:12px;margin-bottom:14px}
 #app .parity-report-intro img{width:48px;height:48px;padding:10px}
 #app .parity-record-heading{padding:16px}
 #app .parity-record-heading h2{font-size:22px}
 #app .parity-record-heading p,#app .parity-record-heading>strong{font-size:14px}
 #app .parity-report-record .chemical-review-card p{font-size:16px}
 #app .parity-harvest-row{padding:14px 16px}
 #app .parity-harvest-row strong{font-size:17px}
 #app .parity-harvest-row small{font-size:12px}
 #app .parity-harvest-row button{font-size:14px;padding:10px 12px}
 #app .parity-usage :is(.chemical-review-card,.chemical-confirmed-block){padding:14px;margin-bottom:12px}
 #app .parity-usage>.chemical-confirmed-block:nth-child(2){padding:14px;gap:8px}
 #app .parity-usage .chemical-confirmed-block:has(.chemical-usage-product){padding:0}
 #app .parity-usage h2,#app .parity-usage .parity-total h2,#app .parity-season-copy h2{font-size:24px}
 #app .parity-usage h3,#app .parity-category-amount strong{font-size:17px}
 #app .parity-usage h4{font-size:16px;margin-bottom:8px}
 #app .parity-usage small,#app .parity-usage label{font-size:12px}
 #app .parity-season-copy small:last-child{font-size:12px}
 #app .parity-usage :is(.chemical-usage-product p,.chemical-review-card>p,.parity-total-copy p){font-size:14px}
 #app .parity-usage input{font-size:16px;padding:8px}
 #app .parity-usage>.chemical-confirmed-block:first-child button{font-size:14px;padding:10px;width:112px}
 #app .parity-usage>.chemical-confirmed-block:nth-child(2)>button{font-size:16px;min-height:46px}
 #app .parity-usage .chemical-usage-product{padding:14px 16px}
 #app .parity-usage .chemical-review-card>strong{font-size:18px}
 #app .parity-usage-exports button{font-size:16px;min-height:48px}
 #app .parity-operator-row{padding:14px;gap:12px;margin-bottom:12px}
 #app .parity-operator-row strong{font-size:18px}
 #app .parity-operator-row small{font-size:14px}
}
/* Laptop workspace: use horizontal space without enlarging the phone interface. */
@media(min-width:1000px){
 #app{max-width:1280px;width:calc(100% - 40px)}
 #app :is(.farm-content,.fert-content,.blocks-content,.task-content,.crop-content,.settings-content,.approvals-content,.chemical-master-content,.chemical-store-content,.parity-activities,.parity-operators,.parity-block-reports,.parity-block-record,.parity-usage){max-width:1160px}
 #app .dashboard-content{max-width:1200px;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(340px,1fr);gap:18px 24px;padding:24px}
 #app .dashboard-hero{grid-column:1;grid-row:1/3;height:250px}
 #app .dashboard-glance-title{grid-column:2;grid-row:1;margin:0;padding:0}
 #app .dashboard-glance{grid-column:2;grid-row:2;margin:0;align-self:start}
 #app .dashboard-tiles{grid-column:1/-1;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:4px 0}
 #app .dashboard-tile{height:108px;flex-direction:row;gap:10px;padding:12px}
 #app .dashboard-tile img{width:48px;height:48px;flex:none}
 #app .dashboard-tile strong{font-size:14px;text-align:left}
 #app .dashboard-footer{grid-column:1/-1;font-size:12px}
 #app .dashboard-brand{flex:none;width:250px;margin-right:auto;margin-left:16px}
 #app .parity-operators{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
 #app .parity-operators>.parity-action{grid-column:1/-1;width:auto;justify-self:start;min-width:220px}
 #app .parity-operator-row{margin:0}
 #app .parity-block-reports{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
 #app .parity-block-reports>:is(.parity-report-hero,p,button:not(.chemical-list-row)){grid-column:1/-1}
 #app .parity-block-reports .chemical-list-row{margin:0}
 #app :is(.chemical-store-quick,.fert-store-quick){max-width:780px}
 #app :is(.chemical-store-hero,.fert-store-hero){height:170px}
}
@media(min-width:1000px) and (max-height:800px){
 #app .dashboard-header{height:60px;box-sizing:border-box;padding-block:2px}
 #app .dashboard-menu-button,#app .dashboard-bell{height:52px}
 #app .dashboard-brand{height:44px;margin-block:0}
 #app .dashboard-content{padding:14px 24px;gap:12px 24px}
 #app .dashboard-hero{height:200px}
 #app .dashboard-glance{padding:4px 10px}
 #app .dashboard-metric{padding:4px 3px;gap:7px}
 #app .dashboard-soft-icon{width:32px;height:32px}
 #app .dashboard-icon{width:24px;height:24px}
 #app .dashboard-labels{gap:2px}
 #app .dashboard-labels>span{font-size:12px}
 #app .dashboard-tiles{gap:10px;margin:0}
 #app .dashboard-tile{height:72px;padding:8px 12px;box-sizing:border-box}
 #app .dashboard-tile img{width:40px;height:40px}
 #app .dashboard-footer{padding:7px 12px}
}
/* Full laptop window; content remains readable and long workflows scroll. */
@media(min-width:1000px){
 #app{width:100%;max-width:none;min-height:100dvh;border:0;box-shadow:none}
 #app :is(.farm-content,.fert-content,.blocks-content,.task-content,.crop-content,.settings-content,.approvals-content,.chemical-master-content,.chemical-store-content,.parity-activities,.parity-operators,.parity-block-reports,.parity-block-record,.parity-usage){max-width:none}
 #app .dashboard-shell{min-height:100dvh;display:flex;flex-direction:column}
 #app .dashboard-content{max-width:none;width:100%;flex:1;box-sizing:border-box;align-content:start}
 #app .dashboard-footer{margin-top:auto}
}