/* Shared public calculators: match the platform's Poppins type, compact actions and touch controls. */
.crowd-description{font-family:Poppins,Arial,sans-serif;font-weight:400}
@media screen and (max-width:700px){
 body{font-size:14px;line-height:1.65}
 main{padding:32px 20px 24px}
 .title{margin-bottom:28px}
 h1{font-size:36px;line-height:1.15;letter-spacing:-1.5px;margin:8px 0 16px}
 h2,.summary h2{font-size:24px;line-height:1.3;letter-spacing:-.6px}
 h3,.event-consumption h3,#defaultRatiosPanel h3{font-size:20px;line-height:1.4}
 .section-title{gap:12px;margin-bottom:22px;align-items:center}
 .section-title>span{flex:0 0 30px;width:30px;height:30px;font-size:11px}
 section{padding:18px;margin-bottom:20px;border-radius:6px}
 .workspace{gap:20px}
 .grid{gap:18px}
 label{font-size:13px;line-height:1.6}
 .muted,small{font-size:12px;line-height:1.8}
 .ratio-help{font-size:12px;line-height:1.8;padding:16px}
 input:not([type=checkbox]):not([type=range]),select,textarea{font-family:Poppins,Arial,sans-serif;font-size:16px!important;line-height:24px;min-height:48px;padding:11px 12px}
 input[type=checkbox]{width:18px;height:18px;flex:0 0 18px;margin:0;accent-color:#0029ff}
 .price-toggle,.planner-fee-choice{min-height:44px;gap:10px;align-items:center}
 .optional-events{margin-top:20px}
 #eventChoices{display:flex;align-items:center;gap:4px 18px;flex-wrap:wrap}
 #eventChoices label{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin:0}
 .planner-fee-choice{display:flex}
 button{font:400 12px/20px Poppins,Arial,sans-serif;min-height:44px;padding:11px 14px;border-radius:5px}
 .title>button,.export>button{display:inline-flex;justify-content:center;align-items:center;gap:18px;width:190px;min-width:190px;min-height:44px;margin-top:16px}
 .export{display:flex;flex-direction:column;align-items:flex-start;gap:16px;margin-top:24px}
 .export>button{margin-top:0}
 .export p{font-size:13px;line-height:1.7}
 .export small{font-size:11px;line-height:1.7}
 .summary{padding:22px;border-radius:6px}
 .summary .total{font-size:32px;line-height:1.3}
 .summary .stats{padding:18px 0;margin:18px 0}
 .stats strong{font-family:Poppins,Arial,sans-serif;font-size:28px;font-weight:400}
 .budget-history button{height:44px;min-height:44px;width:44px;padding:10px}
 .budget-editor tbody tr{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr) 92px;column-gap:8px}
 .budget-editor tbody td:last-child{height:44px;gap:4px}
 .budget-editor tbody td:last-child button{height:44px;min-height:44px;width:44px;min-width:44px;padding:10px;margin:0}
 .budget-editor .summary-share input:not([type=range]),.budget-editor input.edit-amount{min-height:44px;padding:9px 6px!important}
 .budget-editor input.category-name{padding:5px 2px!important;min-height:40px}
 .budget-editor td:nth-child(2)::before,.budget-editor td:nth-child(3)::before{font-size:12px;line-height:1.6;margin-bottom:6px}
 .default-ratio-field{gap:12px;align-items:center}
 .default-ratio-value input:not([type=range]){min-height:44px;padding:9px 6px}
 .table-wrap{max-width:100%;margin:0}
 #events{gap:16px}
 #events .event{padding:16px;border-radius:6px}
 #events .event-head{min-height:44px;gap:10px}
 #events .event-head>label{font-size:18px;font-weight:400;cursor:pointer}
 #events .event-fields{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;margin:18px 0}
 #events .vibe{padding:16px;margin:18px 0}
 .vibe .crowd-heading{font-size:16px;line-height:1.5;margin-bottom:12px}
 .crowd-description{font-size:12px;line-height:1.7;align-items:center}
 .range-ends{font-size:10px;line-height:1.6}
 #events .drink-options{gap:8px;padding-top:16px}
 #events .drink-options label{min-height:44px;padding:9px 10px;font-size:12px;border-radius:5px;line-height:1.6}
 .mix-group label{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px}
 .mix-group label>span{float:none;white-space:nowrap;color:#777;font-size:12px}
 .mix-group h4{font-size:14px;font-weight:400}
 .mix-group h4 span{font-size:12px}
 .event-total{font-size:12px;line-height:1.7;gap:12px}
 #barAdjustments .table-wrap{overflow:visible}
 #barAdjustments table,#prices{display:block;width:100%;min-width:0}
 #barAdjustments thead{display:none}
 #prices tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;padding:18px 0;border-bottom:1px solid #dedede}
 #prices td{display:block;width:auto;min-width:0;border:0;padding:0}
 #prices td:first-child{grid-column:1/-1;font-size:14px;font-weight:400}
 #prices td:first-child small{font-size:11px;font-weight:300}
 #prices td:nth-child(2)::before{content:'Servings per unit'}
 #prices td:nth-child(3)::before{content:'Price'}
 #prices td:nth-child(4)::before{content:'Priced by'}
 #prices td:not(:first-child)::before{display:block;font-size:12px;color:#777;line-height:1.6;margin-bottom:6px}
 #prices td:nth-child(4){grid-column:1/-1}
 #prices input,#prices select{width:100%;min-width:0;margin:0}
 .hide-prices #prices td:nth-child(2){grid-column:1/-1}
 .event-consumption{padding:16px}
 .event-consumption th{font-size:10px;padding:10px 4px}
 .event-consumption td{font-size:12px;padding:10px 4px}
 .event-consumption th:first-child,.event-consumption td:first-child{min-width:0;width:46%;overflow-wrap:anywhere}
 footer{padding:24px 0;gap:18px}
 footer img{width:160px}
 footer p{font-size:11px;line-height:1.8}
 footer nav{flex-wrap:wrap;gap:16px;font-size:11px}
}
@media screen and (max-width:359px){
 header.ids-header .brand-link{flex:0 0 125px}header.ids-header .brand-link img{width:125px!important}
 header.ids-header nav{gap:10px!important}header.ids-header{gap:10px}
 main{padding-inline:16px}section{padding:16px}
 h1{font-size:34px}
 .budget-editor tbody tr{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);row-gap:10px}
 .budget-editor tbody td:last-child{grid-column:1/-1;grid-row:4;justify-content:flex-end}
 .budget-editor td.edit-secondary{grid-row:3}
}
@media screen and (max-width:700px){input[type=range]{min-height:44px;touch-action:pan-y}button.text-link{min-height:44px}}

/* Give every select the same small chevron and a comfortable inset. */
body select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23777777' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;background-size:14px 14px;padding-right:44px!important}
@media(forced-colors:active){body select{appearance:auto;-webkit-appearance:auto;background-image:none}}

/* Safari date controls must shrink with their grid cell. */
.grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid>label{min-width:0}
input[type=date]{appearance:none;-webkit-appearance:none;box-sizing:border-box;min-width:0;max-width:100%;width:100%}
input[type=date]::-webkit-date-and-time-value{text-align:left;min-height:24px}
@media screen and (max-width:600px){.grid{grid-template-columns:minmax(0,1fr)}}
/* Isolate the report from the long, scrolled calculator on mobile print engines. */
@media print{
 html,body{height:auto!important;min-height:0!important;overflow:visible!important;margin:0!important;padding:0!important}
 body>:not(#printReport){display:none!important}
 body>#printReport{display:block!important;position:static!important;margin:0!important;padding:0!important;width:auto!important;max-width:none!important;transform:none!important;overflow:visible!important}
 #printReport header{display:flex!important;justify-content:space-between;align-items:center;break-inside:avoid}
 #printReport section{break-inside:auto;page-break-inside:auto}
 #printReport h1,#printReport h2{break-after:avoid}
 #printReport table{width:100%;table-layout:auto}
 #printReport tr{break-inside:avoid}
}
