.bag-weight-page { --bag-ink:#21382e; --bag-paper:#f6f3eb; --bag-card:#fffefa; --bag-line:#d9d4c8; --bag-green:#203c32; --bag-accent:#b55132; }
.bag-weight-page .load-skip { position:absolute; left:-10000px; top:8px; z-index:100; padding:9px 12px; border:1px solid var(--bag-line); background:var(--bag-card); color:var(--bag-ink); }
.bag-weight-page .load-skip:focus-visible { left:12px; outline:3px solid #b5513240; outline-offset:2px; }
.bag-weight-main { max-width:1060px; }
.bag-weight-tool { padding:22px 24px 24px; background:var(--bag-card); border:1px solid #cac9bb; border-top:4px solid var(--bag-accent); }
.bag-weight-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; padding-bottom:15px; border-bottom:1px solid var(--bag-line); }
.bag-weight-heading h1 { margin:0 0 8px; font-size:clamp(30px,4vw,45px); }
.bag-weight-heading p { margin:0; max-width:640px; color:#62695e; line-height:1.55; }
.bag-weight-heading .bag-weight-answer { margin:0 0 9px; color:var(--bag-ink); font-size:20px; font-weight:650; line-height:1.4; }
.bag-weight-reference { margin-top:18px; }
.bag-weight-reference h2, .bag-weight-order-title { margin:0 0 10px; color:var(--bag-ink); font-size:18px; }
.bag-weight-reference-list { margin:0; padding:0; list-style:none; }
.bag-weight-reference-row { display:grid; grid-template-columns:minmax(0,1fr) 104px minmax(0,1.45fr); align-items:start; gap:14px; padding:12px 0; border-top:1px solid var(--bag-line); color:var(--bag-ink); font-size:13px; line-height:1.5; }
.bag-weight-reference-row > strong { font-variant-numeric:tabular-nums; }
.bag-weight-reference-row a, .bag-weight-reference-next a { color:#315b49; text-underline-offset:3px; }
.bag-weight-reference-row small { display:block; color:#62695e; font-size:11px; line-height:1.5; font-weight:400; }
.bag-weight-reference-note, .bag-weight-order-intro { margin:11px 0 0; color:#4f5f54; font-size:12px; line-height:1.65; }
.bag-weight-reference-next { margin:9px 0 0; font-size:13px; }
.bag-weight-reference-next a { display:inline-flex; min-height:44px; align-items:center; }
.bag-weight-order-title { margin-top:16px; padding-top:19px; border-top:2px solid var(--bag-line); scroll-margin-top:12px; }
.bag-weight-mark { flex:0 0 auto; padding:8px 11px; border:1px solid var(--bag-line); color:#62695e; font-size:11px; letter-spacing:.03em; }
.bag-weight-workspace { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(280px,.95fr); gap:24px; align-items:start; padding-top:20px; }
.bag-weight-form { display:grid; gap:14px; }
.bag-weight-fields { display:grid; grid-template-columns:minmax(0,1fr) minmax(105px,.42fr); gap:13px; }
.bag-weight-fields label, .bag-weight-form > label { display:grid; align-content:start; gap:7px; color:var(--bag-ink); font-size:13px; font-weight:650; }
.bag-weight-fields label span, .bag-weight-form > label span { color:#62695e; font-size:11px; font-weight:500; }
.bag-weight-form input, .bag-weight-form select { width:100%; min-height:44px; padding:9px 11px; border:1px solid #bbbeb1; border-radius:3px; background:#fff; font:inherit; color:var(--bag-ink); }
.bag-weight-form input:focus-visible, .bag-weight-form select:focus-visible, .bag-weight-form button:focus-visible, .bag-weight-result button:focus-visible { outline:3px solid #b5513240; outline-offset:2px; }
.bag-weight-form fieldset { min-width:0; margin:0; padding:0; border:0; }
.bag-weight-form legend { margin-bottom:8px; color:var(--bag-accent); font-size:11px; font-weight:700; letter-spacing:.11em; text-transform:uppercase; }
.bag-weight-form small { color:#62695e; font-size:11px; line-height:1.45; font-weight:400; }
.bag-weight-form fieldset label[for="bag-count"] small { display:block; }
.bag-weight-form fieldset label[for="bag-count"] #bag-count-handoff-note { margin-top:4px; color:#315b49; font-weight:600; }
.bag-weight-result { padding:19px; background:var(--bag-green); color:#fffefa; }
.bag-weight-result-kicker { margin:0 0 5px; color:#e7bd88; font-size:10px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.bag-weight-result h2 { margin:0; font-family:Georgia,"Times New Roman",serif; font-size:23px; font-weight:400; }
.bag-weight-total { margin:12px 0 0; color:#f9d098; font-family:Georgia,"Times New Roman",serif; font-size:clamp(32px,4vw,44px); line-height:1.06; overflow-wrap:anywhere; }
.bag-weight-result-label, .bag-weight-per { margin:5px 0 0; color:#d7e1d3; font-size:12px; line-height:1.5; }
.bag-weight-status { min-height:36px; margin:12px 0; color:#d7e1d3; font-size:12px; line-height:1.5; }
.bag-weight-status.error { color:#ffd3bb; }
.bag-weight-plan { padding-top:12px; border-top:1px solid #ffffff35; }
.bag-weight-plan h3 { margin:0 0 5px; color:#fffefa; font-size:13px; }
.bag-weight-plan-summary { margin:0 0 10px; color:#d7e1d3; font-size:11px; line-height:1.5; }
.bag-weight-plan dl { display:grid; grid-template-columns:1fr auto; gap:8px 12px; margin:0; font-size:11px; }
.bag-weight-plan dt { color:#d7e1d3; }
.bag-weight-plan dd { margin:0; color:#fff4dc; font-weight:700; text-align:right; }
.bag-weight-result button { width:100%; min-height:44px; margin-top:14px; padding:10px 13px; border:1px solid #dfbd84; border-radius:3px; background:#f2cb90; color:var(--bag-ink); font:inherit; font-size:12px; font-weight:700; cursor:pointer; }
.bag-weight-result button:disabled { opacity:.55; cursor:not-allowed; }
.bag-weight-copy-status { min-height:16px; margin:7px 0 0; color:#f5d49f; font-size:11px; }
.bag-weight-copy-fallback { width:100%; margin-top:8px; color:var(--bag-ink); }
.bag-weight-caution { margin:13px 0 0; padding-top:10px; border-top:1px solid #ffffff35; color:#d7e1d3; font-size:10px; line-height:1.5; }
.bag-weight-diagram { margin:18px 0 0; padding:12px; background:#efede4; border:1px solid var(--bag-line); }
.bag-weight-diagram img { display:block; width:100%; height:auto; }
.bag-weight-diagram figcaption { margin-top:8px; color:#62695e; font-size:11px; line-height:1.5; }
.bag-weight-section { margin-top:18px; padding:21px 23px; border:1px solid var(--bag-line); background:#fffefa; }
.bag-weight-section h2 { margin:0 0 10px; font-family:Georgia,"Times New Roman",serif; font-size:25px; font-weight:400; }
.bag-weight-section h3 { margin:16px 0 5px; font-size:14px; }
.bag-weight-section p, .bag-weight-section li { color:#4f5f54; font-size:13px; line-height:1.7; }
.bag-weight-section ul { padding-left:20px; }
.bag-weight-formula { margin:14px 0 0; padding:12px 14px; border-left:3px solid var(--bag-accent); background:#f3f0e7; color:var(--bag-ink); font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:11px; line-height:1.8; overflow-wrap:anywhere; }
.bag-weight-sources { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.bag-weight-sources article { padding-top:10px; border-top:1px solid var(--bag-line); }
.bag-weight-sources a { color:#315b49; text-underline-offset:3px; }
.bag-weight-faq details { padding:12px 0; border-top:1px solid var(--bag-line); }
.bag-weight-faq summary { color:var(--bag-ink); font-size:13px; font-weight:650; cursor:pointer; }
.bag-weight-faq details p { margin:8px 0 0; }
.bag-weight-breadcrumb { margin:0 0 11px; color:#62695e; font-size:11px; }
.bag-weight-breadcrumb a { color:#315b49; text-underline-offset:3px; }
.bag-weight-footnote { font-size:11px !important; }
.bag-weight-page a, .bag-weight-page button, .bag-weight-page input, .bag-weight-page select, .bag-weight-page summary { touch-action:manipulation; -webkit-tap-highlight-color:rgba(181,81,50,.18); }
.bag-weight-page a:hover { color:#203c32; text-decoration-thickness:2px; }
.bag-weight-page a:active { color:#b55132; }
.bag-weight-result button:hover:not(:disabled) { border-color:#fff4dc; background:#ffe0ae; }
.bag-weight-result button:active:not(:disabled) { background:#e8b56e; transform:translateY(1px); }
@media(max-width:760px) {
  .bag-weight-page .page-shell { width:min(100% - 32px,660px); }
  .bag-weight-tool { padding:17px 16px 18px; }
  .bag-weight-heading { display:block; }
  .bag-weight-reference-row { grid-template-columns:minmax(0,1fr) 105px; gap:5px 10px; }
  .bag-weight-reference-row > span:last-child { grid-column:1/-1; }
  .bag-weight-reference-row > strong { text-align:right; }
  .bag-weight-mark { display:inline-block; margin-top:10px; }
  .bag-weight-workspace { grid-template-columns:1fr; gap:16px; padding-top:16px; }
  .bag-weight-result { order:1; }
  .bag-weight-section { padding:17px 16px; }
}
@media(max-width:420px) {
  .bag-weight-page .page-shell { width:calc(100% - 24px); }
  .bag-weight-fields { grid-template-columns:minmax(0,1fr) 88px; gap:9px; }
  .bag-weight-tool { padding-inline:12px; }
  .bag-weight-result { padding:16px 14px; }
  .bag-weight-section { padding-inline:13px; }
  .bag-weight-sources { grid-template-columns:1fr; }
}
