#cost-workspace { display: block; }
#cost-workspace .intro { margin-bottom: 18px; }
.toolbar { display: flex; gap: 10px; align-items: center; position: sticky; top: 0; z-index: 5; padding: 12px 16px; margin: 0 0 18px; background: #edf1e7; border: 1px solid #a7b29f; border-radius: 8px; box-shadow: 0 3px 9px #0001; }
.toolbar > div { margin-right: auto; }
.toolbar small { display: block; margin-top: 4px; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.section-heading h2 { margin: 5px 0 12px; }
.channel-grid { margin-top: 16px; grid-template-columns: repeat(3,1fr); }
.channel-grid label { padding: 14px; background: #f3f6ef; border-top: 3px solid #ae9151; border-radius: 8px; }
.channel-grid input { font-size: 1.4rem; font-weight: 700; }
.catalog-heading { margin-bottom: 12px; }
.cost-group { padding: 14px; }
.cost-group h3 { margin: 4px 0 12px; }
.cost-row { display: grid; grid-template-columns: 45px minmax(220px,2.5fr) minmax(100px,1fr) minmax(100px,1fr) minmax(100px,1fr) 85px; gap: 12px; border-top: 1px solid #d6ddd2; padding: 14px 0; align-items: start; }
.cost-row.selected { background: #f2f6ec; border-radius: 5px; }
.cost-row input, .cost-row select { padding: 8px; }
.cost-row label { font-size: .88rem; }
.cost-row input[type=checkbox] { width: 20px; height: 20px; margin: 8px 0; }
.cost-row .description { font-weight: 700; }
.row-identity, .row-cost, .row-consumption { display: grid; gap: 8px; }
.variation-options { display: grid; grid-template-columns: repeat(3,1fr); gap: 5px; }
.row-status { color: #9d2020; font-size: .83rem; min-height: 1.2em; }
.row-cost small { color: #5c6957; }
.row-actions { display: grid; gap: 8px; padding-top: 22px; }
.row-actions button { padding: 8px 4px; }
.cost-row .delete { background: #fff; color: #943232; border-color: #d6aaaa; }
.cost-row [data-field=markup] { min-width: 0; }
.cost-totals { display: flex; gap: 30px; padding: 12px 0 20px; }
.cost-totals strong { display: block; font-size: 1.8rem; }
#decision .price-options { grid-template-columns: repeat(3,minmax(0,1fr)); }
#decision .actions { margin-top: 16px; }
.pending { padding: 12px; border-left: 4px solid #b58723; background: #fff6df; color: #6c501b; }
.breakdown { max-height: 260px; overflow: auto; margin: 12px 0; }
.breakdown table { font-size: .9rem; }
.scenario-card input { font-size: 1.1rem; }
@media(max-width:1000px) { .cost-row { grid-template-columns: 40px minmax(190px,2fr) 1fr 1fr; } .row-markup { grid-column: 2; } .row-actions { grid-column: 4; padding: 0; } }
@media(max-width:650px) { .toolbar { flex-wrap: wrap; position: static; } .toolbar > div { flex-basis: 100%; } .toolbar button { flex: 1; } .cost-row { grid-template-columns: 32px minmax(0,1fr); gap: 12px; } .cost-row > :not(:first-child) { grid-column: 2; } .cost-row .delete { grid-column: 2; } .channel-grid, #decision .price-options { grid-template-columns: 1fr; } .section-heading { flex-wrap: wrap; } .variation-options { grid-template-columns: 1fr; } .cost-totals { flex-direction: column; gap: 8px; } header a { margin-left: 0; } }
@media print { .toolbar, #catalog-form, .scenario-card, .intro, .history, #simulation-state { display: none !important; } #decision { border: 0; } .breakdown { max-height: none; overflow: visible; } #decision .price-options { grid-template-columns: repeat(3,1fr); } }