@import url("https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,600;1,9..144,400&display=swap");
/* ==========================================================================
   Village Bears HOUSE RULES (Oct 29 2026) - loaded last, overrides everything.
   Source of truth: the H4.43 winner + the "House style rules" board on the
   Village Bears Redesign canvas. Delete this one file to undo.
   1 serif (Fraunces) + Inter. Buttons: 8px soft corner. No boxes, no grey
   title bars: space + one hairline. Pale rounded panels only. Navy is the one
   colour. Messages = dot + one sentence. One radio size (18px).
   Selectors carry body:not(#vbx):not(#vby) on purpose: it outranks the older
   id-scoped rules (checkout pass 1 etc.) so this file always wins.
   ========================================================================== */
:root{
  --vbh-ground:#E6E8EB; --vbh-panel:#EEF0F2; --vbh-navy:#123560; --vbh-deep:#0B2A50;
  --vbh-plat:#C9CCD1; --vbh-ink:#15202E; --vbh-muted:#5F6672; --vbh-line:#C4C8CE;
  --vbh-field:#7C838E; --vbh-red:#B3261E; --vbh-tan:#B2A592;
  --vbh-serif:Fraunces,Georgia,serif; --vbh-sans:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
  --vbh-btn-radius:8px;
}

/* ---------- 1. Buttons: one shape everywhere ---------- */
html body:not(#vbx):not(#vby) .cssButton, html body:not(#vbx):not(#vby) span.normal_button, html body:not(#vbx):not(#vby) .cssButtonHover,
html body:not(#vbx):not(#vby) input.cssButton, html body:not(#vbx):not(#vby) input.submit_button, html body:not(#vbx):not(#vby) .button_submit,
html body:not(#vbx):not(#vby) input[type="submit"], html body:not(#vbx):not(#vby) button[type="submit"], html body:not(#vbx):not(#vby) input[type="button"],
html body:not(#vbx):not(#vby) a.vb-btn, html body:not(#vbx):not(#vby) button.vb-btn, html body:not(#vbx):not(#vby) a.vb-cartbtn, html body:not(#vbx):not(#vby) .vb-find button,
html body:not(#vbx):not(#vby) #vbInterest .vb-int__submit, html body:not(#vbx):not(#vby) .vb-lw-cart__btn, html body:not(#vbx):not(#vby) .buttonRow a.vb-btn{
  border-radius:var(--vbh-btn-radius) !important;
}
html body:not(#vbx):not(#vby) .cssButton, html body:not(#vbx):not(#vby) span.normal_button, html body:not(#vbx):not(#vby) input.cssButton, html body:not(#vbx):not(#vby) input.submit_button{
  font-family:var(--vbh-sans) !important; font-weight:600 !important; letter-spacing:.02em;
}

/* ---------- 2. Serif = Fraunces only ---------- */
html body:not(#vbx):not(#vby) h1, html body:not(#vbx):not(#vby) .centerColumn h1, html body:not(#vbx):not(#vby) #indexDefaultHeading, html body:not(#vbx):not(#vby) .vb-serif{
  font-family:var(--vbh-serif) !important; font-weight:400 !important;
}
html body:not(#vbx):not(#vby) .vb-pp__coll, html body:not(#vbx):not(#vby) em.vb-serif{font-family:var(--vbh-serif)}
html body:not(#vbx):not(#vby) .centerColumn .productSpecialPrice, html body:not(#vbx):not(#vby) .vb-pp__price, html body:not(#vbx):not(#vby) .vb-price{font-variant-numeric:lining-nums}

/* ---------- 3. No boxes: fieldsets become sections with a hairline ---------- */
html body:not(#vbx):not(#vby) .centerColumn fieldset{
  border:0 !important; border-top:1px solid var(--vbh-line) !important; border-radius:0 !important;
  background:transparent !important; box-shadow:none !important;
  padding:22px 0 10px !important; margin:0 0 14px !important; min-width:0;
}
html body:not(#vbx):not(#vby) .centerColumn fieldset > legend{
  float:left !important; width:100% !important; display:block !important; box-sizing:border-box;
  margin:0 0 14px !important; padding:0 !important; border:0 !important;
  background:transparent !important; box-shadow:none !important;
  font-family:var(--vbh-serif) !important; font-weight:400 !important; font-size:24px !important;
  letter-spacing:-.01em !important; text-transform:none !important; color:var(--vbh-ink) !important;
  line-height:1.2 !important; text-align:left !important;
}
html body:not(#vbx):not(#vby) .centerColumn fieldset > legend + *{clear:both}
html body:not(#vbx):not(#vby) .centerColumn fieldset fieldset{border-top:0 !important; padding-top:6px !important}
html body:not(#vbx):not(#vby) .centerColumn fieldset fieldset > legend{
  font-family:var(--vbh-sans) !important; font-size:12px !important; font-weight:600 !important;
  letter-spacing:.14em !important; text-transform:uppercase !important; color:var(--vbh-muted) !important;
}

/* grey / dark title bars on headings inside pages */
html body:not(#vbx):not(#vby) .centerColumn h2, html body:not(#vbx):not(#vby) .centerColumn h3, html body:not(#vbx):not(#vby) .centerColumn h4{
  background:transparent !important; box-shadow:none !important; border-radius:0 !important;
}
html body:not(#vbx):not(#vby) .centerColumn h2:not([class*="vb-"]), html body:not(#vbx):not(#vby) .centerColumn h3:not([class*="vb-"]){
  color:var(--vbh-ink) !important; padding-left:0 !important; padding-right:0 !important;
}
html body:not(#vbx):not(#vby) .centerColumn h2:not([class*="vb-"]){
  font-family:var(--vbh-serif) !important; font-weight:400 !important; text-transform:none !important;
  letter-spacing:-.01em !important; text-align:left !important;
}

/* ---------- 4. Tables: no grey header rows, no zebra, hairlines ---------- */
html body:not(#vbx):not(#vby) .centerColumn tr.tableHeading, html body:not(#vbx):not(#vby) .centerColumn tr.tableHeading th,
html body:not(#vbx):not(#vby) .centerColumn tr.tableHeading td, html body:not(#vbx):not(#vby) .centerColumn table th,
html body:not(#vbx):not(#vby) .centerColumn .tableHeading, html body:not(#vbx):not(#vby) .centerColumn .productListing-heading{
  background:transparent !important; background-image:none !important;
  color:var(--vbh-muted) !important; font-family:var(--vbh-sans) !important;
  font-size:12px !important; font-weight:600 !important; letter-spacing:.14em !important;
  text-transform:uppercase !important; border:0 !important; border-bottom:1px solid var(--vbh-line) !important;
  border-radius:0 !important;
}
html body:not(#vbx):not(#vby) .centerColumn .productListing-heading a{color:var(--vbh-muted) !important}
html body:not(#vbx):not(#vby) .centerColumn tr.rowEven, html body:not(#vbx):not(#vby) .centerColumn tr.rowOdd,
html body:not(#vbx):not(#vby) .centerColumn tr.productListing-even, html body:not(#vbx):not(#vby) .centerColumn tr.productListing-odd,
html body:not(#vbx):not(#vby) .centerColumn .rowEven td, html body:not(#vbx):not(#vby) .centerColumn .rowOdd td{
  background:transparent !important;
}
html body:not(#vbx):not(#vby) #cartContentsDisplay td, html body:not(#vbx):not(#vby) .centerColumn table.cartContentsDisplay td,
html body:not(#vbx):not(#vby) #orderHistoryDetailedOrder td, html body:not(#vbx):not(#vby) #prevOrders td, html body:not(#vbx):not(#vby) #cartContentsDisplay th{
  border-bottom:1px solid var(--vbh-line) !important;
}
html body:not(#vbx):not(#vby) #cartSubTotal{border:0 !important; border-top:1px solid var(--vbh-line) !important}
html body:not(#vbx):not(#vby) #cartContentsDisplay .fa, html body:not(#vbx):not(#vby) #cartContentsDisplay .fas, html body:not(#vbx):not(#vby) #cartContentsDisplay .fa-solid{color:var(--vbh-muted) !important}

/* ---------- 5. Messages: dot + one sentence, never a coloured box ---------- */
html body:not(#vbx):not(#vby) .messageStackError, html body:not(#vbx):not(#vby) .messageStackCaution,
html body:not(#vbx):not(#vby) .messageStackWarning, html body:not(#vbx):not(#vby) .messageStackSuccess{
  background:transparent !important; background-image:none !important; border:0 !important;
  border-radius:0 !important; box-shadow:none !important;
  color:var(--vbh-ink) !important; font-family:var(--vbh-sans) !important; font-size:15px !important;
  font-weight:400 !important; line-height:1.5 !important;
  padding:14px 0 14px 18px !important; margin:0 0 18px !important; position:relative; text-align:left !important;
}
html body:not(#vbx):not(#vby) .messageStackError::before, html body:not(#vbx):not(#vby) .messageStackCaution::before,
html body:not(#vbx):not(#vby) .messageStackWarning::before, html body:not(#vbx):not(#vby) .messageStackSuccess::before{
  content:""; position:absolute; left:0; top:21px; width:7px; height:7px; border-radius:999px; background:var(--vbh-red);
}
html body:not(#vbx):not(#vby) .messageStackSuccess::before, html body:not(#vbx):not(#vby) .messageStackWarning::before{background:var(--vbh-navy)}
html body:not(#vbx):not(#vby) .messageStackError img, html body:not(#vbx):not(#vby) .messageStackCaution img,
html body:not(#vbx):not(#vby) .messageStackWarning img, html body:not(#vbx):not(#vby) .messageStackSuccess img{display:none !important}
html body:not(#vbx):not(#vby) .messageStackError *, html body:not(#vbx):not(#vby) .messageStackCaution *, html body:not(#vbx):not(#vby) .messageStackWarning *, html body:not(#vbx):not(#vby) .messageStackSuccess *{color:inherit !important}

/* ---------- 6. Choices: one radio and one checkbox everywhere ---------- */
html body:not(#vbx):not(#vby) input[type="radio"]:not(#vbh-x){
  -webkit-appearance:none !important; appearance:none !important; accent-color:auto !important; width:18px !important; height:18px !important;
  min-width:18px !important; margin:0 10px 0 0; padding:0 !important; flex:none;
  border:1.5px solid var(--vbh-navy) !important; border-radius:999px !important;
  background:transparent !important; box-shadow:none !important;
  display:inline-grid; place-content:center; vertical-align:middle; cursor:pointer;
}
html body:not(#vbx):not(#vby) input[type="radio"]::before{content:""; width:8px; height:8px; border-radius:999px; background:var(--vbh-navy); transform:scale(0); transition:transform .12s}
html body:not(#vbx):not(#vby) input[type="radio"]:checked::before{transform:scale(1)}
html body:not(#vbx):not(#vby) input[type="checkbox"]:not(#vbh-x){
  -webkit-appearance:none !important; appearance:none !important; accent-color:auto !important; width:18px !important; height:18px !important;
  min-width:18px; margin:0 10px 0 0; padding:0 !important; flex:none;
  border:1.5px solid var(--vbh-navy) !important; border-radius:4px !important;
  background:transparent !important; box-shadow:none !important;
  display:inline-grid; place-content:center; vertical-align:middle; cursor:pointer;
}
html body:not(#vbx):not(#vby) input[type="checkbox"]:not(#vbh-x):checked{background:var(--vbh-navy) !important}
html body:not(#vbx):not(#vby) input[type="checkbox"]:checked::before{content:""; width:9px; height:5px; border-left:2px solid #F0F2F5; border-bottom:2px solid #F0F2F5; transform:rotate(-45deg) translate(1px,-1px)}
html body:not(#vbx):not(#vby) input[type="radio"]:focus-visible, html body:not(#vbx):not(#vby) input[type="checkbox"]:focus-visible{outline:2px solid var(--vbh-navy); outline-offset:2px}

/* ---------- 7. Fields: one style (soft box, chosen by Paul Oct 29) inside page content ---------- */
html body:not(#vbx):not(#vby) .centerColumn input[type="text"], html body:not(#vbx):not(#vby) .centerColumn input[type="email"],
html body:not(#vbx):not(#vby) .centerColumn input[type="password"], html body:not(#vbx):not(#vby) .centerColumn input[type="tel"],
html body:not(#vbx):not(#vby) .centerColumn input[type="number"], html body:not(#vbx):not(#vby) .centerColumn input[type="date"],
html body:not(#vbx):not(#vby) .centerColumn input:not([type]), html body:not(#vbx):not(#vby) .centerColumn textarea, html body:not(#vbx):not(#vby) .centerColumn select{
  background:#fff !important; border:1px solid var(--vbh-line) !important;
  border-radius:8px !important; box-shadow:none !important; color:var(--vbh-ink) !important;
  font-family:var(--vbh-sans) !important; font-size:16px !important; padding:10px 12px !important;
  min-height:44px; box-sizing:border-box; transition:border-color .15s, box-shadow .15s;
}
html body:not(#vbx):not(#vby) .centerColumn select{padding-right:32px !important; cursor:pointer}
html body:not(#vbx):not(#vby) .centerColumn textarea{min-height:88px}
html body:not(#vbx):not(#vby) .centerColumn input[type="text"]:hover, html body:not(#vbx):not(#vby) .centerColumn input[type="email"]:hover,
html body:not(#vbx):not(#vby) .centerColumn input[type="password"]:hover, html body:not(#vbx):not(#vby) .centerColumn input[type="tel"]:hover,
html body:not(#vbx):not(#vby) .centerColumn textarea:hover, html body:not(#vbx):not(#vby) .centerColumn select:hover{
  border-color:var(--vbh-field) !important;
}
html body:not(#vbx):not(#vby) .centerColumn input[type="text"]:focus, html body:not(#vbx):not(#vby) .centerColumn input[type="email"]:focus,
html body:not(#vbx):not(#vby) .centerColumn input[type="password"]:focus, html body:not(#vbx):not(#vby) .centerColumn input[type="tel"]:focus,
html body:not(#vbx):not(#vby) .centerColumn input[type="number"]:focus, html body:not(#vbx):not(#vby) .centerColumn input:not([type]):focus,
html body:not(#vbx):not(#vby) .centerColumn textarea:focus, html body:not(#vbx):not(#vby) .centerColumn select:focus{
  outline:none !important; background:#fff !important; border-color:var(--vbh-navy) !important; box-shadow:0 0 0 1px var(--vbh-navy) !important;
}
/* Browser autofill: keep the field white (Chrome tints filled fields blue) */
html body:not(#vbx):not(#vby) .centerColumn input:-webkit-autofill, html body:not(#vbx):not(#vby) .centerColumn input:-webkit-autofill:hover,
html body:not(#vbx):not(#vby) .centerColumn select:-webkit-autofill{
  -webkit-box-shadow:0 0 0 1000px #fff inset !important; box-shadow:0 0 0 1000px #fff inset !important;
  -webkit-text-fill-color:var(--vbh-ink) !important; caret-color:var(--vbh-ink);
}
html body:not(#vbx):not(#vby) .centerColumn input:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 1000px #fff inset, 0 0 0 1px var(--vbh-navy) !important; box-shadow:0 0 0 1000px #fff inset, 0 0 0 1px var(--vbh-navy) !important;
}
html body:not(#vbx):not(#vby) .centerColumn label.inputLabel, html body:not(#vbx):not(#vby) .centerColumn label.inputLabelPayment{
  font-family:var(--vbh-sans) !important; font-size:12px !important; font-weight:600 !important;
  letter-spacing:.1em !important; text-transform:uppercase !important; color:var(--vbh-muted) !important;
}
html body:not(#vbx):not(#vby) .centerColumn .alert, html body:not(#vbx):not(#vby) .centerColumn span.alert{border:0 !important; padding:0 !important; margin:0 !important; color:var(--vbh-muted) !important; font-size:13px !important}
html body:not(#vbx):not(#vby) .centerColumn .alert::before{display:none !important}

/* ---------- 8. Notes and small boxes that crept in ---------- */
html body:not(#vbx):not(#vby) .vb-pp .vb-prenote{
  background:transparent !important; border:0 !important; border-left:0 !important; border-radius:0 !important;
  padding:0 !important; margin:4px 0 0 !important; color:var(--vbh-muted) !important; font-size:14px !important;
}
html body:not(#vbx):not(#vby) #vbLwCart.vb-lw-cart, html body:not(#vbx):not(#vby) .vb-lw-cart{
  background:transparent !important; border:0 !important; border-radius:0 !important; box-shadow:none !important;
  border-top:1px solid var(--vbh-line) !important; border-bottom:1px solid var(--vbh-line) !important;
  padding:18px 0 !important;
}

/* ---------- 9. Links: navy, never the stock Zen blue ---------- */
html body:not(#vbx):not(#vby) .centerColumn a:not(.vb-btn):not([class*="vb-"]):not([class*="button"]):not([class*="btn"]){color:var(--vbh-navy)}
html body:not(#vbx):not(#vby) .centerColumn a:not(.vb-btn):not([class*="vb-"]):not([class*="button"]):not([class*="btn"]):hover{color:var(--vbh-deep)}

/* ---------- 10. Cart (VB_cart board) ---------- */
html body:not(#vbx):not(#vby) #cartInstructionsDisplay, html body:not(#vbx):not(#vby) #shoppingCartDefault .cartTotalsDisplay,
html body:not(#vbx):not(#vby) #shoppingCartDefault a[href*="info_shopping_cart"]{display:none !important}
html body:not(#vbx):not(#vby) #cartContentsDisplay{margin-top:18px}
html body:not(#vbx):not(#vby) #cartContentsDisplay td{color:var(--vbh-ink) !important; vertical-align:middle !important; padding-top:18px !important; padding-bottom:18px !important}
html body:not(#vbx):not(#vby) #cartContentsDisplay td.cartProductDisplay a{color:var(--vbh-ink) !important; font-size:16px; font-weight:500}
html body:not(#vbx):not(#vby) #cartContentsDisplay td.cartProductDisplay a:hover{color:var(--vbh-navy) !important}
html body:not(#vbx):not(#vby) #cartContentsDisplay td.cartTotalDisplay, html body:not(#vbx):not(#vby) #cartContentsDisplay td.cartUnitDisplay{color:var(--vbh-ink) !important; font-size:16px !important; font-weight:400 !important; font-variant-numeric:lining-nums}
html body:not(#vbx):not(#vby) #cartContentsDisplay td.cartUnitDisplay{color:var(--vbh-muted) !important}
html body:not(#vbx):not(#vby) #cartContentsDisplay td.cartProductDisplay img{border-radius:8px; margin-right:12px}
html body:not(#vbx):not(#vby) #cartContentsDisplay td.cartQuantityUpdate input[type="image"], html body:not(#vbx):not(#vby) #cartContentsDisplay td.cartRemoveItemDisplay img{
  filter:grayscale(1) brightness(.55); opacity:.75; width:18px !important; height:auto !important;
}
html body:not(#vbx):not(#vby) #cartContentsDisplay td.cartQuantityUpdate input[type="image"]:hover, html body:not(#vbx):not(#vby) #cartContentsDisplay td.cartRemoveItemDisplay a:hover img{opacity:1}
html body:not(#vbx):not(#vby) #cartContentsDisplay .cartRemoveItemDisplay .fa, html body:not(#vbx):not(#vby) #cartContentsDisplay .cartRemoveItemDisplay i{color:var(--vbh-muted) !important; font-size:16px}
html body:not(#vbx):not(#vby) #cartContentsDisplay td.cartQuantity input{width:48px !important; text-align:center}
html body:not(#vbx):not(#vby) #cartSubTotal{font-family:var(--vbh-serif) !important; font-size:22px !important; font-weight:400 !important; color:var(--vbh-ink) !important; padding:18px 0 !important; text-align:right; font-variant-numeric:lining-nums}
html body:not(#vbx):not(#vby) #shippingEstimatorContent table th, html body:not(#vbx):not(#vby) #shippingEstimatorContent tr.tableHeading,
html body:not(#vbx):not(#vby) #shippingEstimatorContent th{background:transparent !important; color:var(--vbh-muted) !important; font-size:12px !important; font-weight:600 !important; letter-spacing:.14em !important; text-transform:uppercase !important; border:0 !important; border-bottom:1px solid var(--vbh-line) !important}
html body:not(#vbx):not(#vby) #shippingEstimatorContent td{border-bottom:1px solid var(--vbh-line) !important; color:var(--vbh-ink) !important; padding:14px 6px !important}
html body:not(#vbx):not(#vby) #shippingEstimatorContent td.cartTotalDisplay, html body:not(#vbx):not(#vby) #shippingEstimatorContent .cartTotalDisplay{color:var(--vbh-ink) !important; font-weight:400 !important}
html body:not(#vbx):not(#vby) #shippingEstimatorContent h2{font-size:24px !important; margin-top:40px !important; padding-top:28px !important; border-top:1px solid var(--vbh-line) !important}

/* ---------- 11. Button text: sentence case, like H4.43 ---------- */
html body:not(#vbx):not(#vby) .cssButton, html body:not(#vbx):not(#vby) span.normal_button, html body:not(#vbx):not(#vby) input.cssButton, html body:not(#vbx):not(#vby) input.submit_button,
html body:not(#vbx):not(#vby) a.vb-btn, html body:not(#vbx):not(#vby) button.vb-btn, html body:not(#vbx):not(#vby) .vb-lw-cart__btn{
  text-transform:none !important; letter-spacing:.01em !important; font-size:15px !important; font-weight:600 !important;
}
html body:not(#vbx):not(#vby) span.cssButton.small_edit, html body:not(#vbx):not(#vby) span.normal_button.small_edit{
  background:transparent !important; color:var(--vbh-navy) !important; border:1.5px solid var(--vbh-navy) !important;
  font-size:13px !important; padding:6px 14px !important; line-height:1.4 !important; box-shadow:none !important;
}
html body:not(#vbx):not(#vby) span.cssButton.small_edit:hover{background:var(--vbh-navy) !important; color:#F0F2F5 !important}
html body:not(#vbx):not(#vby) .centerColumn tr:has(> th), html body:not(#vbx):not(#vby) .centerColumn thead tr{background:transparent !important}
html body:not(#vbx):not(#vby) a[href^="javascript:session_win"]{display:none !important}
html body:not(#vbx):not(#vby) .centerColumn .custom-control{display:flex !important; align-items:center; gap:0; padding-left:0 !important; margin:10px 0 22px !important}
html body:not(#vbx):not(#vby) .centerColumn .custom-control-label{padding-left:0 !important; margin:0 !important; font-size:15px; color:var(--vbh-ink)}
html body:not(#vbx):not(#vby) .centerColumn .custom-control-label::before, html body:not(#vbx):not(#vby) .centerColumn .custom-control-label::after{display:none !important}
html body:not(#vbx):not(#vby) .centerColumn .custom-control-input{position:static !important; opacity:1 !important; z-index:auto !important; pointer-events:auto !important}

/* ---------- 12. Store notices inside messages (shipping quote, pre-order choice) ---------- */
html body:not(#vbx):not(#vby) .vb-shipchoice{background:transparent !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; padding:0 !important; margin:0 !important}
html body:not(#vbx):not(#vby) .vb-shipchoice p{margin:0 !important; padding:0 !important}
html body:not(#vbx):not(#vby) .messageStackError:has(.vb-shipchoice)::before, html body:not(#vbx):not(#vby) .messageStackCaution:has(.vb-shipchoice)::before{background:var(--vbh-navy) !important}

/* ---------- 13. Layaway pages + form errors (VB_cart / VB_terms boards) ---------- */
html body:not(#vbx):not(#vby) .vb-lw__terms{background:transparent !important; border:0 !important; border-top:1px solid var(--vbh-line) !important; border-radius:0 !important; box-shadow:none !important; padding:24px 0 8px !important}
html body:not(#vbx):not(#vby) .vb-lw__terms li{color:var(--vbh-ink) !important; font-size:15px !important; line-height:1.6 !important; margin-bottom:8px}
html body:not(#vbx):not(#vby) .vb-lw-cart__opts{background:transparent !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; padding-left:28px !important}
html body:not(#vbx):not(#vby) .vb-int__errors, html body:not(#vbx):not(#vby) .vb-lw .vb-int__errors, html body:not(#vbx):not(#vby) .vb-lw-cart__err{
  border:0 !important; background:transparent !important; position:relative; padding:4px 0 4px 18px !important; margin:0 0 22px !important;
  color:var(--vbh-ink) !important; font-size:15px !important; font-weight:400 !important;
}
html body:not(#vbx):not(#vby) .vb-int__errors::before, html body:not(#vbx):not(#vby) .vb-lw-cart__err::before{content:""; position:absolute; left:0; top:12px; width:7px; height:7px; border-radius:999px; background:var(--vbh-red)}
html body:not(#vbx):not(#vby) .vb-int__errors p{color:var(--vbh-ink) !important; font-size:15px !important; font-weight:400 !important}

/* ---------- 14. Account pages ---------- */
html body:not(#vbx):not(#vby) .centerColumn .instructions, html body:not(#vbx):not(#vby) #addressBookDefault .instructions{background:var(--vbh-panel) !important; border:1px solid var(--vbh-line) !important; border-radius:12px !important; padding:20px 24px !important}
html body:not(#vbx):not(#vby) a.vb-acct__signout{border-radius:var(--vbh-btn-radius) !important; text-transform:none !important; letter-spacing:.01em !important; font-size:14px !important; font-weight:600 !important}
html body:not(#vbx):not(#vby) .vb-acct__grid{border-radius:12px !important; overflow:hidden}

/* ---------- 15. Page numbers, old category text, contact form ---------- */
html body:not(#vbx):not(#vby) .navSplitPagesLinks a, html body:not(#vbx):not(#vby) .navSplitPagesLinks strong.current, html body:not(#vbx):not(#vby) .navSplitPagesLinks .current{
  display:inline-flex; align-items:center; justify-content:center; min-width:36px; height:36px; padding:0 10px !important; margin:0 3px !important;
  border-radius:var(--vbh-btn-radius) !important; font-family:var(--vbh-sans) !important; font-size:14px !important; font-weight:500 !important; box-sizing:border-box;
}
html body:not(#vbx):not(#vby) .navSplitPagesLinks a{background:transparent !important; color:var(--vbh-ink) !important; border:1px solid var(--vbh-line) !important}
html body:not(#vbx):not(#vby) .navSplitPagesLinks a:hover{border-color:var(--vbh-navy) !important; color:var(--vbh-navy) !important}
html body:not(#vbx):not(#vby) .navSplitPagesLinks strong.current, html body:not(#vbx):not(#vby) .navSplitPagesLinks .current{background:var(--vbh-navy) !important; color:#F0F2F5 !important; border:1px solid var(--vbh-navy) !important}
html body:not(#vbx):not(#vby) .navSplitPagesResult{color:var(--vbh-muted) !important; font-size:13px !important}
html body:not(#vbx):not(#vby) #categoryDescription, html body:not(#vbx):not(#vby) #categoryDescription *{color:var(--vbh-ink) !important; font-family:var(--vbh-sans) !important; font-style:normal !important}
html body:not(#vbx):not(#vby) #categoryDescription h1, html body:not(#vbx):not(#vby) #categoryDescription h2, html body:not(#vbx):not(#vby) #categoryDescription h3{font-family:var(--vbh-serif) !important; font-weight:400 !important}
html body:not(#vbx):not(#vby) #categoryDescription b, html body:not(#vbx):not(#vby) #categoryDescription strong{font-weight:600 !important}
html body:not(#vbx):not(#vby) #categoryDescription font[size]{font-size:inherit !important}
html body:not(#vbx):not(#vby) #contactUsDefault select[size]{height:auto !important; min-height:44px; overflow:auto}

/* ---------- 16. Contact us: shop details left, form right ---------- */
@media (min-width:860px){
  html body:not(#vbx):not(#vby) #contactUsDefault > form{display:grid; grid-template-columns:300px minmax(0,1fr); column-gap:64px; align-items:start; max-width:1080px; margin:0 auto}
  html body:not(#vbx):not(#vby) #contactUsDefault > form > address{grid-column:1; grid-row:1}
  html body:not(#vbx):not(#vby) #contactUsDefault > form > #contactUsNoticeContent{grid-column:1; grid-row:2}
  html body:not(#vbx):not(#vby) #contactUsDefault > form > fieldset{grid-column:2; grid-row:1 / span 3}
  html body:not(#vbx):not(#vby) #contactUsDefault > form > .buttonRow{grid-column:2; grid-row:4; margin-top:8px}
  html body:not(#vbx):not(#vby) #contactUsDefault > form > .buttonRow.forward{justify-self:end}
  html body:not(#vbx):not(#vby) #contactUsDefault > form > .buttonRow.back{justify-self:start}
}
html body:not(#vbx):not(#vby) #contactUsDefault address{font-style:normal; font-size:15px; line-height:1.7; color:var(--vbh-ink); padding-top:22px}
html body:not(#vbx):not(#vby) #contactUsDefault address::before{content:"The shop"; display:block; font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--vbh-muted); margin-bottom:10px}
html body:not(#vbx):not(#vby) #contactUsNoticeContent{font-size:15px; line-height:1.6; color:var(--vbh-muted); margin-top:18px}
html body:not(#vbx):not(#vby) #contactUsNoticeContent strong, html body:not(#vbx):not(#vby) #contactUsNoticeContent b{color:var(--vbh-ink); font-weight:600}
html body:not(#vbx):not(#vby) #contactUsDefault fieldset > legend{font-size:34px !important}

/* ---------- 17. Category page header: title left, logos right, one hairline ---------- */
html body:not(#vbx):not(#vby) #cat-top > #cat-left{float:none !important; width:auto !important; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; padding:6px 0 22px; margin:0 0 26px; border-bottom:1px solid var(--vbh-line)}
html body:not(#vbx):not(#vby) #cat-top #indexCategoriesHeading{margin:0 !important; padding:0 !important; font-size:44px !important; line-height:1.08 !important; letter-spacing:-.02em !important; text-align:left !important; color:var(--vbh-ink) !important}
html body:not(#vbx):not(#vby) #cat-top #categoryImgListing{display:flex; align-items:center; gap:14px; margin:0 !important; float:none !important}
html body:not(#vbx):not(#vby) #cat-top .catDescContent{clear:both; float:none !important; width:auto !important; max-width:880px; margin:0 auto 18px}

/* ---------- 18. Info pages (EZ pages), wishlist ---------- */
html body:not(#vbx):not(#vby) #ezPageDefault{max-width:760px; margin:0 auto}
html body:not(#vbx):not(#vby) #ezPageDefault .vb-lwinfo__lead{font-family:var(--vbh-serif) !important; font-size:20px !important; line-height:1.5 !important; color:var(--vbh-ink) !important; margin:0 0 8px !important}
html body:not(#vbx):not(#vby) #ezPageDefault .vb-policy h3{margin-top:30px !important}
html body:not(#vbx):not(#vby) #ezPageDefault .vb-policy li{margin-bottom:8px; line-height:1.6}
html body:not(#vbx):not(#vby) .vb-wl a.vb-btn, html body:not(#vbx):not(#vby) [class*="vb-wl"] a.vb-btn, html body:not(#vbx):not(#vby) a.vb-btn{text-decoration:none !important}
html body:not(#vbx):not(#vby) button.vb-wishlist__removebtn{background:transparent !important; color:var(--vbh-muted) !important; border:0 !important; padding:0 !important; min-height:0 !important; font-size:13px !important; font-weight:500 !important; text-decoration:underline !important; text-decoration-color:var(--vbh-line) !important; text-underline-offset:4px; box-shadow:none !important; cursor:pointer}
html body:not(#vbx):not(#vby) button.vb-wishlist__removebtn:hover{color:var(--vbh-navy) !important}
html body:not(#vbx):not(#vby) .vb-lw__plan{border-radius:12px !important}
@media (max-width:640px){
  html body:not(#vbx):not(#vby) #cartContentsDisplay td{border-bottom:0 !important; padding-top:6px !important; padding-bottom:6px !important}
  html body:not(#vbx):not(#vby) #cartContentsDisplay tr{border-bottom:1px solid var(--vbh-line)}
}

/* ---------- 19. Cart, tightened (Paul Oct 29 am): aligned columns, right-hand summary ---------- */
html body:not(#vbx):not(#vby) #shoppingCartDefault #cartContentsDisplay{width:100%; border-collapse:collapse; margin-top:10px}
html body:not(#vbx):not(#vby) #shoppingCartDefault #cartContentsDisplay th{padding:10px 8px !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault #scProductsHeading{text-align:left !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault #scUnitHeading, html body:not(#vbx):not(#vby) #shoppingCartDefault #scTotalHeading{text-align:right !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault #scQuantityHeading{text-align:left !important; padding-left:8px !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault #cartContentsDisplay td{padding-top:12px !important; padding-bottom:12px !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault #cartContentsDisplay td.cartQuantity{text-align:left !important; width:64px}
html body:not(#vbx):not(#vby) #shoppingCartDefault #cartContentsDisplay td.cartQuantityUpdate{width:36px}
html body:not(#vbx):not(#vby) #shoppingCartDefault #cartContentsDisplay td.cartUnitDisplay, html body:not(#vbx):not(#vby) #shoppingCartDefault #cartContentsDisplay td.cartTotalDisplay{text-align:right !important; white-space:nowrap; width:110px}
html body:not(#vbx):not(#vby) #shoppingCartDefault #cartContentsDisplay td.cartRemoveItemDisplay{width:44px; text-align:right !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault td.cartProductDisplay > a{display:inline-flex !important; align-items:center; gap:16px; text-decoration:none}
html body:not(#vbx):not(#vby) #shoppingCartDefault td.cartProductDisplay .cartImage{float:none !important; margin:0 !important; display:block}
html body:not(#vbx):not(#vby) #shoppingCartDefault td.cartProductDisplay .cartImage img{width:56px !important; height:56px !important; object-fit:contain; background:#fff; border-radius:8px; margin:0 !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault td.cartProductDisplay .cartProdTitle{font-size:16px; font-weight:500; line-height:1.35}
html body:not(#vbx):not(#vby) #shoppingCartDefault td.cartProductDisplay br.clearBoth{display:none}

@media (min-width:760px){
  html body:not(#vbx):not(#vby) #shoppingCartDefault #shoppingCartForm{display:grid; grid-template-columns:minmax(0,1fr) 400px; column-gap:48px; align-items:start}
  html body:not(#vbx):not(#vby) #shoppingCartDefault #shoppingCartForm > *{grid-column:1 / -1}
  html body:not(#vbx):not(#vby) #shoppingCartDefault #shoppingCartForm > #cartSubTotal{grid-column:2; grid-row:auto}
  html body:not(#vbx):not(#vby) #shoppingCartDefault #shoppingCartForm > .buttonRow.back{grid-column:1; grid-row:2; align-self:start; padding-top:22px}
  html body:not(#vbx):not(#vby) #shoppingCartDefault #shoppingCartForm > #vbLwCart{grid-column:2}
  html body:not(#vbx):not(#vby) #shoppingCartDefault #shoppingCartForm > .buttonRow.forward{grid-column:2}
}
html body:not(#vbx):not(#vby) #shoppingCartDefault #shoppingCartForm > br.clearBoth{display:none}
html body:not(#vbx):not(#vby) #shoppingCartDefault #cartSubTotal{border-top:0 !important; padding:16px 0 12px !important; margin:0 !important; display:flex; justify-content:space-between; font-size:22px !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault #vbLwCart{margin:0 !important; padding:12px 0 !important; width:auto !important; float:none !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault .buttonRow.forward{float:none !important; margin:14px 0 0 !important; text-align:right}
html body:not(#vbx):not(#vby) #shoppingCartDefault .buttonRow.forward a, html body:not(#vbx):not(#vby) #shoppingCartDefault .buttonRow.forward .cssButton{display:block !important; width:100% !important; text-align:center; box-sizing:border-box}
html body:not(#vbx):not(#vby) #shoppingCartDefault .buttonRow.forward .cssButton{padding:15px 24px !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault .buttonRow.back{float:none !important; margin:0 !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault .buttonRow.back .cssButton{background:transparent !important; color:var(--vbh-navy) !important; border:0 !important; padding:0 !important; font-size:14px !important; font-weight:500 !important; box-shadow:none !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault .buttonRow.back .cssButton::before{content:"\2190\00a0"}
html body:not(#vbx):not(#vby) #shoppingCartDefault .buttonRow.back a:hover .cssButton{text-decoration:underline; text-underline-offset:4px}
html body:not(#vbx):not(#vby) #shoppingCartDefault #shippingEstimatorContent{margin-top:36px !important; padding-top:0 !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault #shippingEstimatorContent h2{margin-top:0 !important; padding-top:24px !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault #shippingEstimatorContent h2::after{content:"An estimate only. You choose your shipping method on the checkout page."; display:block; margin-top:6px; font-family:var(--vbh-sans); font-size:14px; letter-spacing:0; color:var(--vbh-muted)}

/* ---------- 20. Shipping estimate: address left, rates right, nothing looks clickable ---------- */
@media (min-width:760px){
  html body:not(#vbx):not(#vby) #shippingEstimatorContent > form{display:grid; grid-template-columns:minmax(0,1fr) 400px; column-gap:48px; align-items:start}
  html body:not(#vbx):not(#vby) #shippingEstimatorContent > form > h2{grid-column:1 / -1}
  html body:not(#vbx):not(#vby) #shippingEstimatorContent > form > .se-address-container, html body:not(#vbx):not(#vby) #shippingEstimatorContent > form > .se-address{grid-column:1}
  html body:not(#vbx):not(#vby) #shippingEstimatorContent > form > #seQuoteResults{grid-column:2; grid-row:2 / span 2}
}
html body:not(#vbx):not(#vby) #shippingEstimatorContent h2{margin-bottom:14px !important}
html body:not(#vbx):not(#vby) #shippingEstimatorContent .se-address{margin-top:12px}
html body:not(#vbx):not(#vby) #shippingEstimatorContent #seShipTo{font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--vbh-muted); margin-bottom:6px}
html body:not(#vbx):not(#vby) #shippingEstimatorContent address{font-style:normal; font-size:15px; line-height:1.55; padding:0 !important; margin:0 !important}
html body:not(#vbx):not(#vby) #shippingEstimatorContent #seQuoteResults{margin-top:20px !important; width:100%}
html body:not(#vbx):not(#vby) #shippingEstimatorContent #seQuoteResults tr{background:transparent !important}
html body:not(#vbx):not(#vby) #shippingEstimatorContent #seQuoteResults td{padding:12px 4px !important; font-weight:400 !important}
html body:not(#vbx):not(#vby) #shippingEstimatorContent #seProductsHeading{text-align:left !important; padding-left:4px !important}
html body:not(#vbx):not(#vby) #shippingEstimatorContent #seTotalHeading{text-align:right !important; padding-right:4px !important}

/* ---------- 21. Cart, one screen (Paul Oct 29 7am): estimate beside the summary, both buttons on one row ---------- */
@media (min-width:760px){
  html body:not(#vbx):not(#vby) #shoppingCartDefault{display:grid !important; grid-template-columns:minmax(0,1fr) 400px; column-gap:56px; align-items:start; grid-template-rows:auto auto auto 1fr auto}
  html body:not(#vbx):not(#vby) #shoppingCartDefault > *{grid-column:1 / -1}
  html body:not(#vbx):not(#vby) #shoppingCartDefault > div.forward:first-child, html body:not(#vbx):not(#vby) #shoppingCartDefault > br, html body:not(#vbx):not(#vby) #shoppingCartDefault > script{display:none !important}
  html body:not(#vbx):not(#vby) #shoppingCartDefault > #shoppingCartForm{display:contents !important}
  html body:not(#vbx):not(#vby) #shoppingCartDefault #shoppingCartForm > #cartContentsDisplay{grid-column:1 / -1; grid-row:2}
  html body:not(#vbx):not(#vby) #shoppingCartDefault #shoppingCartForm > #cartSubTotal{grid-column:2; grid-row:3}
  html body:not(#vbx):not(#vby) #shoppingCartDefault #shoppingCartForm > #vbLwCart{grid-column:2; grid-row:4}
  html body:not(#vbx):not(#vby) #shoppingCartDefault > #shippingEstimatorContent{grid-column:1; grid-row:3 / span 2; margin-top:4px !important; padding-top:0 !important}
  html body:not(#vbx):not(#vby) #shoppingCartDefault #shoppingCartForm > .buttonRow.back{grid-column:1; grid-row:5; padding-top:0 !important; margin-top:18px !important}
  html body:not(#vbx):not(#vby) #shoppingCartDefault #shoppingCartForm > .buttonRow.forward{grid-column:2; grid-row:5; margin-top:18px !important}
}
html body:not(#vbx):not(#vby) #shoppingCartDefault #shippingEstimatorContent h2{font-size:20px !important; padding-top:12px !important; margin-bottom:10px !important; border-top:0 !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault #shippingEstimatorContent .se-address{display:none !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault #shippingEstimatorContent #seQuoteResults{margin-top:12px !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault #shippingEstimatorContent #seQuoteResults td{padding:9px 4px !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault .buttonRow.back .cssButton{background:transparent !important; color:var(--vbh-navy) !important; border:1.5px solid var(--vbh-navy) !important; padding:13.5px 24px !important; font-size:15px !important; font-weight:600 !important; display:inline-block}
html body:not(#vbx):not(#vby) #shoppingCartDefault .buttonRow.back .cssButton::before{content:none !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault .buttonRow.back a:hover .cssButton{background:var(--vbh-navy) !important; color:#F0F2F5 !important; text-decoration:none}
html body:not(#vbx):not(#vby) #shoppingCartDefault .buttonRow.forward .cssButton{padding:15px 24px !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault #seAddressPulldown{width:100% !important; max-width:440px}
html body:not(#vbx):not(#vby) #shoppingCartDefault #vbLwCart, html body:not(#vbx):not(#vby) #shoppingCartDefault #cartSubTotal{align-self:start}
html body:not(#vbx):not(#vby) #shoppingCartDefault #shippingEstimatorContent > form{display:block !important}
html body:not(#vbx):not(#vby) #shoppingCartDefault .se-address-container{display:flex; align-items:center; gap:12px; width:100%}
html body:not(#vbx):not(#vby) #shoppingCartDefault .se-address-container label{flex:none; font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--vbh-muted)}

/* ---------- 22. Cart: pay in full first, layaway behind a quiet link (Oct 29) ---------- */
html body:not(#vbx):not(#vby) .vb-lw-cart__full{display:flex; flex-direction:column; gap:4px; padding:2px 0 10px}
html body:not(#vbx):not(#vby) .vb-lw-cart__full strong{font-size:15px; font-weight:600; color:var(--vbh-ink)}
html body:not(#vbx):not(#vby) .vb-lw-cart__full span{font-size:14px; line-height:1.5; color:var(--vbh-muted)}
html body:not(#vbx):not(#vby) .vb-lw-cart__ask{margin:4px 0 0 !important; font-size:13px; color:var(--vbh-muted)}
html body:not(#vbx):not(#vby) button.vb-lw-cart__link{background:transparent !important; border:0 !important; padding:0 !important; margin:0 !important; min-height:0 !important; box-shadow:none !important; font:inherit !important; font-size:13px !important; font-weight:500 !important; color:var(--vbh-navy) !important; text-decoration:underline !important; text-decoration-color:var(--vbh-line) !important; text-underline-offset:3px; cursor:pointer}
html body:not(#vbx):not(#vby) button.vb-lw-cart__link:hover{text-decoration-color:var(--vbh-navy) !important}
html body:not(#vbx):not(#vby) .vb-lw-cart__opts{padding:12px 0 0 !important}

/* ---------- 23. Layaway month choices: smaller radios, centred on their text (Oct 29) ---------- */
html body:not(#vbx):not(#vby) .vb-lw-cart__m{display:flex !important; align-items:center !important; gap:10px !important; padding:5px 0 !important; cursor:pointer}
html body:not(#vbx):not(#vby) .vb-lw-cart__m input[type="radio"]:not(#vbh-x){width:15px !important; height:15px !important; min-width:15px !important; margin:0 !important; border-width:1.5px !important}
html body:not(#vbx):not(#vby) .vb-lw-cart__m input[type="radio"]:not(#vbh-x)::before{width:7px; height:7px}
html body:not(#vbx):not(#vby) .vb-lw-cart__m span{font-size:14px; line-height:1.4}
html body:not(#vbx):not(#vby) .vb-lw-cart__q{margin:0 0 4px !important; font-size:13px !important}

/* ---------- 24. Split cart: pieces to pay now vs layaway, and the step-2 panel (Oct 29) ---------- */
html body:not(#vbx):not(#vby) .vb-lw-cart__items{margin:0 0 12px; padding:0 0 10px; border-bottom:1px solid var(--vbh-line)}
html body:not(#vbx):not(#vby) .vb-lw-cart__items > .vb-lw-cart__q{font-weight:400 !important; color:var(--vbh-muted) !important; margin-bottom:6px !important}
html body:not(#vbx):not(#vby) .vb-lw-cart__item{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 0; border-top:1px solid var(--vbh-line)}
html body:not(#vbx):not(#vby) .vb-lw-cart__iname{font-size:14px; font-weight:500; color:var(--vbh-ink); line-height:1.35}
html body:not(#vbx):not(#vby) .vb-lw-cart__now{display:flex !important; align-items:center; gap:8px; flex:none; font-size:13px; color:var(--vbh-muted); cursor:pointer; white-space:nowrap}
html body:not(#vbx):not(#vby) .vb-lw-cart__now input[type="checkbox"]:not(#vbh-x){width:15px !important; height:15px !important; min-width:15px !important; margin:0 !important; border-radius:3px !important}
html body:not(#vbx):not(#vby) .vb-lw-cart__now input[type="checkbox"]:not(#vbh-x):checked::before{width:8px; height:4px}
html body:not(#vbx):not(#vby) .vb-lw-cart__now:has(input:checked){color:var(--vbh-navy); font-weight:600}
html body:not(#vbx):not(#vby) .vb-lw-cart__sum{margin:10px 0 0 !important; font-size:14px; color:var(--vbh-muted)}
html body:not(#vbx):not(#vby) .vb-lw-cart__sum strong{color:var(--vbh-ink); font-weight:600; font-variant-numeric:lining-nums}
html body:not(#vbx):not(#vby) .vb-lw-cart__low{position:relative; margin:8px 0 0 !important; padding-left:16px; font-size:14px; color:var(--vbh-ink)}
html body:not(#vbx):not(#vby) .vb-lw-cart__low::before{content:""; position:absolute; left:0; top:7px; width:7px; height:7px; border-radius:999px; background:var(--vbh-red)}
html body:not(#vbx):not(#vby) .vb-lw-cart__btn:disabled{opacity:.45; cursor:not-allowed}
html body:not(#vbx):not(#vby) .vb-lw-step2{background:var(--vbh-panel); border:1px solid var(--vbh-line); border-radius:12px; padding:22px 26px; margin:0 0 28px; display:flex; flex-direction:column; gap:8px; align-items:flex-start}
html body:not(#vbx):not(#vby) .vb-lw-step2__eyebrow{font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--vbh-navy)}
html body:not(#vbx):not(#vby) .vb-lw-step2__title{margin:0 !important; font-family:var(--vbh-serif); font-size:24px; line-height:1.2; color:var(--vbh-ink)}
html body:not(#vbx):not(#vby) .vb-lw-step2__text{margin:0 !important; font-size:15px; line-height:1.55; color:var(--vbh-muted); max-width:620px}
html body:not(#vbx):not(#vby) a.vb-lw-step2__btn{margin-top:8px; display:inline-flex; padding:14px 26px; background:var(--vbh-navy); color:#F0F2F5 !important; font-weight:600; text-decoration:none}

/* ---------- 25. Compact pass (Paul Oct 29 8am): one smaller radio/checkbox everywhere, tighter checkout, layaway terms and thank-you page ---------- */
/* radios + checkboxes: 15 px everywhere (was 18) */
html body:not(#vbx):not(#vby) input[type="radio"]:not(#vbh-x){width:15px !important; height:15px !important; min-width:15px !important; border-width:1.5px !important; margin:0 10px 0 0}
html body:not(#vbx):not(#vby) input[type="radio"]:not(#vbh-x)::before{width:7px !important; height:7px !important}
html body:not(#vbx):not(#vby) input[type="checkbox"]:not(#vbh-x){width:15px !important; height:15px !important; min-width:15px !important; border-radius:3px !important}
html body:not(#vbx):not(#vby) input[type="checkbox"]:not(#vbh-x):checked::before{width:8px !important; height:4px !important}
/* page heading + messages */
html body:not(#vbx):not(#vby) .centerColumn > h1, html body:not(#vbx):not(#vby) .centerColumn h1#checkoutOneHeading, html body:not(#vbx):not(#vby) #checkoutSuccess h1{margin-bottom:14px !important; padding-bottom:12px !important}
html body:not(#vbx):not(#vby) .messageStackError, html body:not(#vbx):not(#vby) .messageStackCaution, html body:not(#vbx):not(#vby) .messageStackWarning, html body:not(#vbx):not(#vby) .messageStackSuccess{padding:6px 0 6px 18px !important; margin:0 0 8px !important}
html body:not(#vbx):not(#vby) .messageStackError::before, html body:not(#vbx):not(#vby) .messageStackCaution::before, html body:not(#vbx):not(#vby) .messageStackWarning::before, html body:not(#vbx):not(#vby) .messageStackSuccess::before{top:14px !important}
/* sections */
html body:not(#vbx):not(#vby) .centerColumn fieldset{padding:14px 0 6px !important; margin:0 0 8px !important}
html body:not(#vbx):not(#vby) .centerColumn fieldset > legend{font-size:21px !important; margin:0 0 8px !important}
html body:not(#vbx):not(#vby) .centerColumn fieldset .important, html body:not(#vbx):not(#vby) .centerColumn fieldset p.important{margin-left:0 !important; padding:0 !important; margin-top:0 !important; margin-bottom:8px !important}
html body:not(#vbx):not(#vby) .centerColumn fieldset address{padding:0 !important; margin:0 !important}
html body:not(#vbx):not(#vby) .centerColumn .custom-control{margin:2px 0 6px !important; min-height:0 !important}
html body:not(#vbx):not(#vby) .centerColumn .custom-radio{margin:0 0 4px !important; padding:6px 0 !important}
html body:not(#vbx):not(#vby) #checkoutOneCartGroup .buttonRow, html body:not(#vbx):not(#vby) #checkoutOneCartGroup .forward{margin:0 !important}
html body:not(#vbx):not(#vby) #checkoutOneCartGroup #cartContentsDisplay{margin-top:0 !important}
html body:not(#vbx):not(#vby) .centerColumn textarea{min-height:64px !important}
/* order tables: the last money column and its heading line up on the right */
html body:not(#vbx):not(#vby) #ccTotalHeading, html body:not(#vbx):not(#vby) #myAccountTotal, html body:not(#vbx):not(#vby) #cartContentsDisplay th:last-child{text-align:right !important}
html body:not(#vbx):not(#vby) #orderHistoryHeading td:last-child, html body:not(#vbx):not(#vby) #cartContentsDisplay td:last-child{text-align:right !important}
html body:not(#vbx):not(#vby) #checkoutSuccess > .forward, html body:not(#vbx):not(#vby) #accountHistInfo > .forward{font-size:14px; color:var(--vbh-muted); margin:0 0 6px !important}
/* thank-you page: step-2 as a quiet note with hairlines, not a panel; secondary buttons as outlines */
html body:not(#vbx):not(#vby) .vb-lw-step2{background:transparent !important; border:0 !important; border-radius:0 !important; border-top:1px solid var(--vbh-line) !important; border-bottom:1px solid var(--vbh-line) !important; padding:14px 0 16px !important; margin:0 0 18px !important; gap:4px !important}
html body:not(#vbx):not(#vby) .vb-lw-step2 p{padding:0 !important}
html body:not(#vbx):not(#vby) .vb-lw-step2__title{font-size:21px !important}
html body:not(#vbx):not(#vby) .vb-lw-step2__eyebrow::before{content:""; display:inline-block; width:7px; height:7px; border-radius:999px; background:var(--vbh-navy); margin-right:8px; vertical-align:middle}
html body:not(#vbx):not(#vby) #checkoutSuccess .buttonRow .cssButton{background:transparent !important; color:var(--vbh-navy) !important; border:1.5px solid var(--vbh-navy) !important; padding:9px 18px !important; font-size:14px !important}
html body:not(#vbx):not(#vby) #checkoutSuccess .buttonRow .cssButton:hover{background:var(--vbh-navy) !important; color:#F0F2F5 !important}
html body:not(#vbx):not(#vby) #checkoutSuccess p, html body:not(#vbx):not(#vby) #checkoutSuccess ul{margin-top:0 !important; margin-bottom:8px !important}
/* layaway terms page */
html body:not(#vbx):not(#vby) .vb-lw .vb-lw__opt, html body:not(#vbx):not(#vby) .vb-lw__months label{padding:9px 0 !important}
html body:not(#vbx):not(#vby) .vb-lw__months{padding-top:12px !important}
html body:not(#vbx):not(#vby) .vb-lw__months > legend, html body:not(#vbx):not(#vby) .vb-lw h2{font-size:21px !important; margin-bottom:6px !important}
html body:not(#vbx):not(#vby) .vb-lw__terms{padding:14px 0 4px !important}
html body:not(#vbx):not(#vby) .vb-lw__terms li{margin-bottom:4px !important; font-size:14.5px !important; line-height:1.5 !important}
html body:not(#vbx):not(#vby) .vb-lw > p, html body:not(#vbx):not(#vby) .vb-lw__intro{margin-bottom:10px !important}
/* cart: subtotal sits on the right, under the totals column */
html body:not(#vbx):not(#vby) #shoppingCartDefault #cartSubTotal{justify-content:flex-end !important; text-align:right !important}
html body:not(#vbx):not(#vby) #checkoutOneCartGroup{position:relative}
html body:not(#vbx):not(#vby) #checkoutOneCartGroup #cartContentsDisplay tr:has(.small_edit){position:absolute; top:4px; right:0; border:0 !important}
html body:not(#vbx):not(#vby) #checkoutOneCartGroup #cartContentsDisplay tr:has(.small_edit) td{border:0 !important; padding:0 !important}
html body:not(#vbx):not(#vby) #checkoutOneCartGroup > legend{min-height:40px; margin-bottom:6px !important}

/* ---------- 26. Order details (account) + layaway payment page (Oct 29) ---------- */
html body:not(#vbx):not(#vby) #accountHistInfo .floatingBox{float:none !important; display:inline-block; vertical-align:top; box-sizing:border-box; width:calc(50% - 24px) !important; margin:0 !important; padding:16px 0 0 !important; border:0 !important; border-top:1px solid var(--vbh-line) !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; color:var(--vbh-ink) !important; opacity:1 !important}
html body:not(#vbx):not(#vby) #accountHistInfo #myAccountShipInfo{margin-right:44px !important}
html body:not(#vbx):not(#vby) #accountHistInfo .floatingBox *{color:var(--vbh-ink) !important; opacity:1 !important}
html body:not(#vbx):not(#vby) #accountHistInfo .floatingBox h3, html body:not(#vbx):not(#vby) #accountHistInfo .floatingBox h4{font-family:var(--vbh-serif) !important; font-weight:400 !important; font-size:21px !important; margin:0 0 8px !important; padding:0 !important}
html body:not(#vbx):not(#vby) #accountHistInfo .floatingBox address, html body:not(#vbx):not(#vby) #accountHistInfo .floatingBox div, html body:not(#vbx):not(#vby) #accountHistInfo .floatingBox p{padding-left:0 !important; margin-left:0 !important; font-style:normal; font-size:15px; line-height:1.6}
html body:not(#vbx):not(#vby) #accountHistInfo .floatingBox h3 ~ h3, html body:not(#vbx):not(#vby) #accountHistInfo .floatingBox h4 ~ h4, html body:not(#vbx):not(#vby) #accountHistInfo .floatingBox * + h3, html body:not(#vbx):not(#vby) #accountHistInfo .floatingBox * + h4{margin-top:18px !important}
@media (max-width:640px){ html body:not(#vbx):not(#vby) #accountHistInfo .floatingBox{width:100% !important; display:block} html body:not(#vbx):not(#vby) #accountHistInfo #myAccountShipInfo{margin-right:0 !important; margin-bottom:18px !important} }
html body:not(#vbx):not(#vby) #vbLayawayPay .vb-rw__sum{grid-template-columns:repeat(3,1fr) !important}
html body:not(#vbx):not(#vby) #vbLayawayPay .vb-rw__sum div:nth-child(3){border-left:1px solid var(--vbh-line) !important}
html body:not(#vbx):not(#vby) #vbLayawayPay .vb-rw__sum div:nth-child(n+3){border-top:0 !important}
html body:not(#vbx):not(#vby) #vbLayawayPay .vb-rw__sum div{padding:14px 12px !important}
html body:not(#vbx):not(#vby) #vbLayawayPay .vb-rw__sum b{font-size:1.75rem !important; white-space:nowrap; font-variant-numeric:lining-nums}
@media (max-width:640px){ html body:not(#vbx):not(#vby) #vbLayawayPay .vb-rw__sum{grid-template-columns:1fr !important} html body:not(#vbx):not(#vby) #vbLayawayPay .vb-rw__sum div + div{border-left:0 !important; border-top:1px solid var(--vbh-line) !important} }
html body:not(#vbx):not(#vby) #vbLayawayPay .vb-lw__method .vb-lw__opt{display:flex !important; align-items:center; gap:10px}
html body:not(#vbx):not(#vby) #vbLayawayPay .vb-lw__optnote{margin-left:auto; font-size:14px; color:var(--vbh-muted)}
html body:not(#vbx):not(#vby) #vbLayawayPay .vb-lw__check{border-top:1px solid var(--vbh-line); border-bottom:1px solid var(--vbh-line); padding:12px 0; margin:6px 0 14px}
html body:not(#vbx):not(#vby) #vbLayawayPay .vb-lw__check p{margin:0 !important; font-size:15px; line-height:1.55; color:var(--vbh-ink)}
html body:not(#vbx):not(#vby) #vbLayawayPay .vb-lw__ppbtns{max-width:420px; margin-top:8px}
html body:not(#vbx):not(#vby) #vbLayawayPay .vb-lw__fine{font-size:14px; color:var(--vbh-muted)}

/* ---------- 27. Address suggestions (Google Places), Oct 29 ---------- */
/* The list is placed under the street field by vb_places.js; the field itself is not wrapped or resized. */
html body:not(#vbx):not(#vby) .vb-ac__list { position: absolute; box-sizing: border-box; max-width: calc(100vw - 32px); z-index: 60; background: var(--vbh-panel); border: 1px solid var(--vbh-line); border-radius: 8px; box-shadow: none; padding: 4px 0; margin: 0; max-height: 320px; overflow-y: auto; text-align: left; }
html body:not(#vbx):not(#vby) .vb-ac__list[hidden] { display: none; }
html body:not(#vbx):not(#vby) .vb-ac__item { display: block; padding: 8px 14px; cursor: pointer; font: 400 14px/1.35 var(--vbh-sans); color: var(--vbh-ink); }
html body:not(#vbx):not(#vby) .vb-ac__item + .vb-ac__item { border-top: 1px solid var(--vbh-plat); }
html body:not(#vbx):not(#vby) .vb-ac__item:hover, html body:not(#vbx):not(#vby) .vb-ac__item.is-active { background: var(--vbh-ground); color: var(--vbh-navy); }
html body:not(#vbx):not(#vby) .vb-ac__main { display: block; font-weight: 500; }
html body:not(#vbx):not(#vby) .vb-ac__sec { display: block; font-size: 12.5px; color: var(--vbh-muted); }
html body:not(#vbx):not(#vby) .vb-ac__foot { padding: 6px 14px 4px; border-top: 1px solid var(--vbh-line); font: 400 12px/1.4 var(--vbh-sans); color: var(--vbh-muted); }

/* ---------- 28. Account address forms: label above field, one column (Oct 29) ---------- */
/* Create account, address book, edit account, login, checkout address pages. Zen's floated 11em labels beside half-width fields are replaced. */
html body:is(#createaccountBody,#addressbookprocessBody,#accounteditBody,#loginBody,#checkoutshippingaddressBody,#checkoutpaymentaddressBody):not(#vbx):not(#vby) .centerColumn label.inputLabel{
  float:none !important; display:block !important; width:auto !important; margin:0 0 6px !important; padding:0 !important; line-height:1.3 !important; text-align:left !important;
}
html body:is(#createaccountBody,#addressbookprocessBody,#accounteditBody,#loginBody,#checkoutshippingaddressBody,#checkoutpaymentaddressBody):not(#vbx):not(#vby) .centerColumn :is(input[type="text"],input[type="email"],input[type="password"],input[type="tel"],input:not([type]),select,textarea){
  float:none !important; display:block !important; width:100% !important; max-width:520px !important; margin:0 0 18px !important;
}
html body:is(#createaccountBody,#addressbookprocessBody,#accounteditBody,#loginBody,#checkoutshippingaddressBody,#checkoutpaymentaddressBody):not(#vbx):not(#vby) .centerColumn fieldset br.clearBoth{display:none !important}
/* Required marks: every field is required except the ones labelled optional below */
html body:is(#createaccountBody,#addressbookprocessBody,#accounteditBody,#loginBody,#checkoutshippingaddressBody,#checkoutpaymentaddressBody):not(#vbx):not(#vby) .centerColumn fieldset span.alert,
html body:is(#createaccountBody,#addressbookprocessBody,#accounteditBody,#loginBody,#checkoutshippingaddressBody,#checkoutpaymentaddressBody):not(#vbx):not(#vby) .centerColumn fieldset div.alert.forward{display:none !important}
html body:is(#createaccountBody,#addressbookprocessBody,#accounteditBody,#loginBody,#checkoutshippingaddressBody,#checkoutpaymentaddressBody):not(#vbx):not(#vby) .centerColumn label.inputLabel:is([for="suburb"],[for="company"])::after{
  content:"  (optional)"; text-transform:none; letter-spacing:0; font-weight:400; white-space:pre;
}
/* Fax is retired */
html body:is(#createaccountBody,#addressbookprocessBody,#accounteditBody,#loginBody,#checkoutshippingaddressBody,#checkoutpaymentaddressBody):not(#vbx):not(#vby) .centerColumn :is(label[for="fax"],#fax){display:none !important}
/* The address block nested inside "Your Personal Details": no second heading or second rule */
html body:is(#createaccountBody,#addressbookprocessBody,#accounteditBody):not(#vbx):not(#vby) .centerColumn fieldset fieldset{border:0 !important; margin:0 !important; padding:0 !important}
html body:is(#createaccountBody,#addressbookprocessBody,#accounteditBody):not(#vbx):not(#vby) .centerColumn fieldset fieldset > legend{display:none !important}
/* Checkbox and radio rows stay on one line */
html body:is(#createaccountBody,#addressbookprocessBody,#accounteditBody,#loginBody):not(#vbx):not(#vby) .centerColumn :is(label.checkboxLabel,label.radioButtonLabel){
  display:inline !important; float:none !important; margin:0 18px 0 8px !important; vertical-align:middle; font-size:15px; color:var(--vbh-ink);
}
html body:is(#createaccountBody,#addressbookprocessBody,#accounteditBody,#loginBody):not(#vbx):not(#vby) .centerColumn :is(input[type="checkbox"],input[type="radio"]){vertical-align:middle; margin:0 !important}
html body:is(#createaccountBody,#addressbookprocessBody,#accounteditBody,#loginBody):not(#vbx):not(#vby) .centerColumn fieldset :is(label.checkboxLabel,label.radioButtonLabel) + br{display:block !important; content:""; margin-bottom:12px}
html body#createaccountBody:not(#vbx):not(#vby) #createAcctDefaultLoginLink{font:400 15px/1.5 var(--vbh-sans) !important; color:var(--vbh-ink); margin:0 0 20px !important}

/* 28b. Fix (Oct 29 11:45): the section-heading float was cleared by Zen's <br>; clear it here instead. Keep hidden fields hidden (CAAS anti-spam). */
html body:is(#createaccountBody,#addressbookprocessBody,#accounteditBody,#loginBody,#checkoutshippingaddressBody,#checkoutpaymentaddressBody):not(#vbx):not(#vby) .centerColumn fieldset > :not(legend){clear:both !important}
html body:is(#createaccountBody,#addressbookprocessBody,#accounteditBody):not(#vbx):not(#vby) .centerColumn fieldset fieldset{display:block !important; width:100% !important; min-width:0 !important; float:none !important}
html body:not(#vbx):not(#vby):not(#vbz) .centerColumn input#CAAS.vb-x, html body:not(#vbx):not(#vby):not(#vbz) .centerColumn input#CAAS, html body:not(#vbx):not(#vby):not(#vbz) .centerColumn input[type="text"][style*="display:none"][style], html body:not(#vbx):not(#vby):not(#vbz) .centerColumn input[name="should_be_empty"][type]{display:none !important}

/* ---------- 29. Oct 29 noon pass (Paul): softer field fill, tighter checkout, smaller thank-you buttons ---------- */
/* Field fill: a pale cool grey from the panel family instead of stark white (luxury, quiet) */
html body:not(#vbx):not(#vby) .centerColumn :is(input[type="text"],input[type="email"],input[type="password"],input[type="tel"],input[type="number"],input[type="date"],input:not([type]),textarea,select),
html body:not(#vbx):not(#vby) .centerColumn :is(input[type="text"],input[type="email"],input[type="password"],input[type="tel"],input[type="number"],input:not([type]),textarea,select):focus{
  background:#EEF0F2 !important;
}
html body:not(#vbx):not(#vby) .centerColumn input:-webkit-autofill, html body:not(#vbx):not(#vby) .centerColumn input:-webkit-autofill:hover{
  -webkit-box-shadow:0 0 0 1000px #EEF0F2 inset !important; box-shadow:0 0 0 1000px #EEF0F2 inset !important;
}
html body:not(#vbx):not(#vby) .centerColumn input:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 1000px #EEF0F2 inset, 0 0 0 1px var(--vbh-navy) !important; box-shadow:0 0 0 1000px #EEF0F2 inset, 0 0 0 1px var(--vbh-navy) !important;
}
html body:not(#vbx):not(#vby) .centerColumn textarea{min-height:76px !important}

/* Buttons on checkout pages: count padding inside the set height (two rules were stacking: 44px + 9px padding = 64px tall) */
html body:is(#checkoutoneBody,#checkoutoneconfirmationBody,#checkoutsuccessBody):not(#vbx):not(#vby) .centerColumn :is(.cssButton,.cssButtonHover){box-sizing:border-box !important}
html body#checkoutsuccessBody:not(#vbx):not(#vby) #checkoutSuccess .buttonRow .cssButton,
html body#checkoutsuccessBody:not(#vbx):not(#vby) #checkoutSuccess .buttonRow .cssButtonHover{
  height:38px !important; padding:0 16px !important; font-size:14px !important; line-height:1 !important; border-width:1px !important;
}
html body#checkoutsuccessBody:not(#vbx):not(#vby) #checkoutSuccess .buttonRow{display:flex !important; gap:8px; align-items:center; flex-wrap:wrap}
html body#checkoutsuccessBody:not(#vbx):not(#vby) #checkoutSuccess .buttonRow a{display:inline-flex}

/* One-Page Checkout: shipping and payment choices sit closer together */
html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutShippingChoices > fieldset{
  border:0 !important; padding:0 !important; margin:0 0 10px !important; background:none !important; min-height:0 !important;
}
html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutShippingChoices > fieldset > legend{margin:0 0 2px !important; padding:0 !important; float:none !important; width:auto !important}
html body#checkoutoneBody:not(#vbx):not(#vby) :is(#checkoutShippingChoices,#checkoutPaymentMethod) .custom-control.custom-radio{
  margin:0 !important; padding-top:4px !important; padding-bottom:4px !important; min-height:0 !important; line-height:24px !important;
}
html body#checkoutoneBody:not(#vbx):not(#vby) :is(#checkoutShippingChoices,#checkoutPaymentMethod) .custom-control-label{line-height:24px !important}
html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutShippingChoices .important.forward{
  margin:4px 0 0 !important; padding:0 !important; line-height:24px !important; font-size:15px !important; color:var(--vbh-ink) !important;
}
html body#checkoutoneBody:not(#vbx):not(#vby) :is(#checkoutShippingChoices,#checkoutPaymentMethod) br.clearBoth{display:none !important}
html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutShippingChoices .important.forward{clear:both}
html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutPaymentMethod :is(.ccinfoText,.alert){margin:0 0 4px 30px !important; font-size:13.5px}
html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutPaymentMethod p.important{margin:0 0 6px !important}

/* ---------- 30. Checkout layout (Paul, Oct 29): payment centred full width; comments beside the Confirm button ---------- */
html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutPaymentMethod{
  float:none !important; clear:both !important; width:100% !important; text-align:center !important;
}
html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutPaymentMethod fieldset > legend{text-align:center !important}
html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutPaymentMethod p.important{text-align:center !important}
html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutPaymentMethod .custom-control.custom-radio{
  display:inline-flex !important; align-items:center; margin:0 22px !important; vertical-align:middle;
}
html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutPaymentMethod :is(.ccinfoText,.alert){text-align:center; margin:4px 0 0 !important}
html body#checkoutoneBody:not(#vbx):not(#vby) #vbOpcBottom{
  clear:both; display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:40px; row-gap:6px; align-items:end; margin:6px 0 0;
}
html body#checkoutoneBody:not(#vbx):not(#vby) #vbOpcBottom > .clearBoth{display:none !important}
html body#checkoutoneBody:not(#vbx):not(#vby) #vbOpcBottom #checkoutComments{
  grid-column:1; grid-row:1 / span 2; float:none !important; width:auto !important; margin:0 !important; max-width:560px;
}
html body#checkoutoneBody:not(#vbx):not(#vby) #vbOpcBottom #checkoutComments fieldset{margin:0 !important; padding-bottom:0 !important; border-top:0 !important}
html body#checkoutoneBody:not(#vbx):not(#vby) #vbOpcBottom #checkoutComments fieldset > legend{font-size:15px !important; font-family:var(--vbh-sans) !important; font-weight:600 !important; margin-bottom:6px !important}
html body#checkoutoneBody:not(#vbx):not(#vby) #vbOpcBottom #checkoutComments textarea{min-height:64px !important; width:100% !important}
html body#checkoutoneBody:not(#vbx):not(#vby) #vbOpcBottom #checkoutOneSubmit{grid-column:2; grid-row:1; float:none !important; margin:0 !important; justify-self:end}
html body#checkoutoneBody:not(#vbx):not(#vby) #vbOpcBottom #checkoutOneEmail{grid-column:2; grid-row:2; float:none !important; margin:0 !important; text-align:right; justify-self:end}
@media (max-width:640px){
  html body#checkoutoneBody:not(#vbx):not(#vby) #vbOpcBottom{grid-template-columns:1fr}
  html body#checkoutoneBody:not(#vbx):not(#vby) #vbOpcBottom #checkoutComments{grid-row:1}
  html body#checkoutoneBody:not(#vbx):not(#vby) #vbOpcBottom #checkoutOneSubmit{grid-column:1; grid-row:2; justify-self:stretch}
  html body#checkoutoneBody:not(#vbx):not(#vby) #vbOpcBottom #checkoutOneEmail{grid-column:1; grid-row:3}
  html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutPaymentMethod .custom-control.custom-radio{display:flex !important; margin:0 !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutPaymentMethod{text-align:left !important}
}

/* ---------- 31. Our story page (EZ-page 9, Oct 29; copy approved by Paul in the About Us chat) ---------- */
html body:not(#vbx):not(#vby) #ezPageDefault:has(.vb-ourstory) > h1{display:none !important}
html body:not(#vbx):not(#vby) .vb-ourstory{max-width:760px; margin:0 auto; padding:8px 0 56px; color:var(--vbh-ink); font-family:var(--vbh-sans)}
html body:not(#vbx):not(#vby) .vb-ourstory__head{display:flex; flex-direction:column; gap:10px; margin:0 0 28px}
html body:not(#vbx):not(#vby) .vb-ourstory__eyebrow{font-size:13px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--vbh-muted)}
html body:not(#vbx):not(#vby) .vb-ourstory .vb-ourstory__title{margin:0 !important; padding:0 !important; border:0 !important; font-family:var(--vbh-serif) !important; font-weight:400 !important; font-size:44px !important; line-height:1.08 !important; letter-spacing:-.02em; color:var(--vbh-ink) !important; text-align:left !important}
html body:not(#vbx):not(#vby) .vb-ourstory p{margin:0 0 14px; font-size:16px; line-height:1.7; color:var(--vbh-ink)}
html body:not(#vbx):not(#vby) .vb-ourstory .vb-ourstory__lede{font-size:17px; margin:0}
html body:not(#vbx):not(#vby) .vb-ourstory .vb-ourstory__lede::first-letter{font-family:var(--vbh-serif); float:left; font-size:76px; line-height:.82; padding:6px 12px 0 0; color:var(--vbh-navy)}
html body:not(#vbx):not(#vby) .vb-ourstory__sec{border-top:1px solid var(--vbh-line); margin-top:32px; padding-top:30px}
html body:not(#vbx):not(#vby) .vb-ourstory__sec h2{margin:0 0 14px !important; padding:0 !important; border:0 !important; background:none !important; font-family:var(--vbh-serif) !important; font-weight:400 !important; font-size:28px !important; letter-spacing:-.01em; line-height:1.2; color:var(--vbh-ink) !important; text-align:left !important; text-transform:none !important}
html body:not(#vbx):not(#vby) .vb-ourstory__sec p:last-child{margin-bottom:0}
html body:not(#vbx):not(#vby) .vb-ourstory .vb-ourstory__cta{display:flex; align-items:center; gap:24px; flex-wrap:wrap; margin-top:20px}
html body:not(#vbx):not(#vby) .vb-ourstory .vb-ourstory__cta span{font-size:15px; color:var(--vbh-muted)}
html body:not(#vbx):not(#vby) .vb-ourstory a.vb-ourstory__btn{display:inline-flex; align-items:center; height:46px; padding:0 28px; border-radius:var(--vbh-btn-radius); background:var(--vbh-navy); color:#F0F2F5 !important; font-size:15px; font-weight:600; text-decoration:none !important}
html body:not(#vbx):not(#vby) .vb-ourstory a.vb-ourstory__btn:hover{background:var(--vbh-deep)}
html body:not(#vbx):not(#vby) .vb-ourstory .vb-ourstory__swatches{display:flex; gap:20px; flex-wrap:wrap; margin-top:18px; font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--vbh-muted)}
html body:not(#vbx):not(#vby) .vb-ourstory__swatches span{display:inline-flex; align-items:center; gap:8px}
html body:not(#vbx):not(#vby) .vb-ourstory__dot{display:inline-block; width:14px; height:14px; border-radius:999px}
html body:not(#vbx):not(#vby) .vb-ourstory__dot--navy{background:var(--vbh-navy)}
html body:not(#vbx):not(#vby) .vb-ourstory__dot--grey{background:var(--vbh-line)}
html body:not(#vbx):not(#vby) .vb-ourstory__dot--lume{background:var(--vbh-tan)}
@media (max-width:640px){
  html body:not(#vbx):not(#vby) .vb-ourstory .vb-ourstory__title{font-size:34px !important}
  html body:not(#vbx):not(#vby) .vb-ourstory .vb-ourstory__lede::first-letter{font-size:60px}
}
html body:not(#vbx):not(#vby) .vb-footer a.vb-footer__story{margin-top:6px; color:var(--vbh-navy) !important; font-weight:600}

/* ---------- 32. Laptop widths (Oct 29, Paul: 'how does it sit on smaller laptops'). Below 1600px the tools row (search left, account/cart right) sits above the categories, which spread evenly; the promo bar drops its 5th item below 1400px and its 4th below 1100px; no sideways scroll from full-bleed sections. ---------- */
html, body{overflow-x:clip}
@media (max-width:1599px){
  html body:not(#vbx):not(#vby) .vb-navbar{padding:10px 32px !important; row-gap:4px !important}
  html body:not(#vbx):not(#vby) .vb-tools{order:-1; width:100%; justify-content:flex-end; align-items:center}
  html body:not(#vbx):not(#vby) .vb-tools .vb-search{margin-right:auto}
  html body:not(#vbx):not(#vby) .vb-nav{width:100%; justify-content:space-between; column-gap:16px !important}
}
@media (max-width:1399px){
  html body:not(#vbx):not(#vby) .vb-util{column-gap:24px !important}
  html body:not(#vbx):not(#vby) .vb-util > :nth-child(5){display:none !important}
}
@media (max-width:1100px){
  html body:not(#vbx):not(#vby) .vb-nav a{font-size:14px !important}
  html body:not(#vbx):not(#vby) .vb-navbar{padding:10px 20px !important}
  html body:not(#vbx):not(#vby) .vb-util > :nth-child(4){display:none !important}
}

/* ---------- 33. Oct 29 (Paul): banner bears say they can be clicked; layaway buttons and amount box ---------- */
html body:not(#vbx):not(#vby) .vb-banner__bear{position:relative}
html body:not(#vbx):not(#vby) .vb-banner__bear img{transition:transform .25s ease}
html body:not(#vbx):not(#vby) .vb-banner__bear:not(.vb-banner__bear--classic):hover img, html body:not(#vbx):not(#vby) .vb-banner__bear:not(.vb-banner__bear--classic):focus-visible img{transform:translateY(-4px)}
html body:not(#vbx):not(#vby) .vb-banner__bear:not(.vb-banner__bear--classic)::after{content:"View this bear"; position:absolute; left:50%; bottom:4px; transform:translate(-50%,4px); white-space:nowrap; background:var(--vbh-navy); color:#F0F2F5; font:600 11px/1 var(--vbh-sans); letter-spacing:.08em; text-transform:uppercase; padding:7px 11px; border-radius:6px; opacity:0; transition:opacity .2s ease, transform .2s ease; pointer-events:none; z-index:2}
html body:not(#vbx):not(#vby) .vb-banner__bear:not(.vb-banner__bear--classic):hover::after, html body:not(#vbx):not(#vby) .vb-banner__bear:not(.vb-banner__bear--classic):focus-visible::after{opacity:1; transform:translate(-50%,0)}
html body:not(#vbx):not(#vby) .vb-banner__inner::after{content:"Click a bear to see it up close"; position:absolute; right:14px; bottom:6px; font:600 10.5px/1 var(--vbh-sans); letter-spacing:.14em; text-transform:uppercase; color:var(--vbh-navy); opacity:.9; background:rgba(230,232,235,.9); padding:5px 9px; border-radius:6px; z-index:3; pointer-events:none; transition:opacity .2s ease}
html body:not(#vbx):not(#vby) .vb-banner__inner:hover::after{opacity:0}
@media (hover:none){ html body:not(#vbx):not(#vby) .vb-banner__inner::after{content:"Tap a bear to see it up close"} }
@media (max-width:700px){ html body:not(#vbx):not(#vby) .vb-banner__inner::after{display:none} }
/* Layaway buttons: "Make a payment" and "I'm mailing a check" look like the Checkout button (the old rule leaned on a product-page colour that doesn't exist here) */
html body:not(#vbx):not(#vby):not(#productinfoBody) .centerColumn :is(a,button).vb-btn.vb-btn--solid{
  display:inline-flex !important; align-items:center; justify-content:center; height:46px !important; padding:0 28px !important; border:0 !important;
  border-radius:var(--vbh-btn-radius) !important; background:var(--vbh-navy) !important; color:#F0F2F5 !important; cursor:pointer;
  font:600 15px/1 var(--vbh-sans) !important; letter-spacing:0 !important; text-transform:none !important; text-decoration:none !important;
}
html body:not(#vbx):not(#vby):not(#productinfoBody) .centerColumn :is(a,button).vb-btn.vb-btn--solid:hover{background:var(--vbh-deep) !important}
html body:not(#vbx):not(#vby):not(#productinfoBody) .centerColumn button.vb-btn.vb-btn--solid:disabled{opacity:.6; cursor:wait}
html body:not(#vbx):not(#vby) #vbLayawayPay .vb-lw__checkgo{margin:14px 0 0 !important}
/* "Another amount" box: sized to its row, not a full form field */
html body:not(#vbx):not(#vby) #vbLayawayPay #vbAmtOther{display:inline-block !important; width:110px !important; min-height:0 !important; height:34px !important; padding:4px 10px !important; font-size:15px !important; text-align:right}

/* 33b. Oct 29 (Paul): quieter bear label: the bear's maker and name (from its title) on the same pale chip as the corner caption, navy text, not a solid navy button */
html body:not(#vbx):not(#vby) .vb-banner__bear:not(.vb-banner__bear--classic)::after{content:attr(title) "  \2192"; background:rgba(230,232,235,.92) !important; color:var(--vbh-navy) !important; border:1px solid var(--vbh-line); font:500 12px/1 var(--vbh-sans) !important; letter-spacing:.02em !important; text-transform:none !important; padding:6px 10px !important; white-space:pre !important}
html body:not(#vbx):not(#vby) .vb-banner__bear:not(.vb-banner__bear--classic):hover img{transform:translateY(-3px)}

/* ---------- 34. Wishlist hearts in dusty rose (Oct 29, Paul): colour only as a small mark, buttons stay navy ---------- */
:root{--vbh-rose:#A85A63}
/* Product page: the heart on the wishlist button turns rose (outline before saving, filled once saved); the words stay navy */
html body:not(#vbx):not(#vby) .vb-btn--line svg, html body:not(#vbx):not(#vby) .vb-btn--line:hover svg{color:var(--vbh-rose)}
/* Wishlist page: the "added" message gets a rose heart instead of the navy dot */
html body#vbwishlistBody:not(#vbx):not(#vby) .messageStackSuccess::before{width:13px !important; height:12px !important; border-radius:0 !important; top:12px !important; background:var(--vbh-rose) !important; -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 20s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.6-7 10-7 10z'/></svg>") center/contain no-repeat; mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 20s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.6-7 10-7 10z'/></svg>") center/contain no-repeat}
/* Wishlist page: a small filled rose heart beside each saved bear's name */
html body#vbwishlistBody:not(#vbx):not(#vby) .vb-wishlist__cell .vb-card__name::before{content:""; display:inline-block; width:12px; height:11px; margin-right:6px; vertical-align:-1px; background:var(--vbh-rose); -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 20s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.6-7 10-7 10z'/></svg>") center/contain no-repeat; mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 20s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.6-7 10-7 10z'/></svg>") center/contain no-repeat}

/* 34b. Oct 29: layaway schedule, partly paid month shows what's left with the full instalment underneath */
html body:not(#vbx):not(#vby) .vb-lw__of{display:block; font-size:12px; color:var(--vbh-muted); font-weight:400; line-height:1.3}

/* ---------- 35. Cart shipping estimator, signed-out version (Oct 29, Paul on his phone): no grey bar, fields stacked like the account forms ---------- */
html body:not(#vbx):not(#vby) #seQuoteResults tr td.seDisplayedAddressLabel, html body:not(#vbx):not(#vby) #shippingEstimatorContent tr:first-child td.seDisplayedAddressLabel{background:transparent !important; color:var(--vbh-muted) !important; text-align:left !important; font:400 14px/1.5 var(--vbh-sans) !important; padding:12px 0 10px !important; border:0 !important; border-bottom:1px solid var(--vbh-line) !important}
html body:not(#vbx):not(#vby) #seQuoteResults .seDisplayedAddressInfo{display:inline; color:var(--vbh-ink) !important; font-weight:600 !important; text-transform:none !important; text-align:left !important; letter-spacing:0}
html body:not(#vbx):not(#vby) #shippingEstimatorContent th{background:transparent !important}
html body:not(#vbx):not(#vby) #seQuoteResults{width:100% !important}
html body:not(#vbx):not(#vby) #seQuoteResults td{border:0 !important}
html body:not(#vbx):not(#vby) #shippingEstimatorContent label.inputLabel{float:none !important; display:block !important; width:auto !important; margin:12px 0 6px !important; padding:0 !important; font:600 12px/1.3 var(--vbh-sans) !important; letter-spacing:.1em !important; text-transform:uppercase !important; color:var(--vbh-muted) !important; text-align:left !important}
html body:not(#vbx):not(#vby) #shippingEstimatorContent :is(#country, #stateZone, #state, #postcode){display:block; float:none !important; width:100% !important; max-width:420px; margin:0 !important}
html body:not(#vbx):not(#vby) #shippingEstimatorContent #state[style*="none"], html body:not(#vbx):not(#vby) #shippingEstimatorContent #stateZone[style*="none"]{display:none !important}
html body:not(#vbx):not(#vby) #shippingEstimatorContent br.clearBoth{display:none !important}
html body:not(#vbx):not(#vby) #shippingEstimatorContent span.alert{display:none !important}
html body:not(#vbx):not(#vby) #shippingEstimatorContent .buttonRow{float:none !important; margin:16px 0 4px !important}

/* 35b. estimator: pull the ZIP label up over the blank line Zen leaves after the State box; prices line up on the right */
html body:not(#vbx):not(#vby) #shippingEstimatorContent label.inputLabel[for="postcode"]{margin-top:-12px !important}
html body:not(#vbx):not(#vby) #seQuoteResults td + td{text-align:right !important; white-space:nowrap}
html body:not(#vbx):not(#vby) #seQuoteResults td:first-child{padding-left:0 !important}

/* ---------- 36. Cart on phones (Oct 29, Paul's iPhone screenshots): item row as photo+name, then qty / total / remove; full-width buttons; estimator prices on the right ---------- */
@media (max-width:640px){
  html body#shoppingcartBody:not(#vbx):not(#vby) #cartContentsDisplay tr:has(th){display:none !important}
  html body#shoppingcartBody:not(#vbx):not(#vby) #cartContentsDisplay tr:has(td){display:grid !important; grid-template-columns:auto auto 1fr auto; grid-template-areas:"prod prod prod prod" "qty upd total rm"; column-gap:14px; row-gap:12px; align-items:center; padding:16px 0 !important; border-bottom:1px solid var(--vbh-line)}
  html body#shoppingcartBody:not(#vbx):not(#vby) #cartContentsDisplay tr:has(td) > td{display:block !important; padding:0 !important; border:0 !important; width:auto !important; position:static !important; text-align:left !important; float:none !important; margin:0 !important}
  html body#shoppingcartBody:not(#vbx):not(#vby) #cartContentsDisplay tr:has(td) > td::before{content:none !important; display:none !important}
  html body#shoppingcartBody:not(#vbx):not(#vby) #cartContentsDisplay td.cartProductDisplay{grid-area:prod}
  html body#shoppingcartBody:not(#vbx):not(#vby) #cartContentsDisplay td.cartQuantity{grid-area:qty; font-size:12px; color:var(--vbh-muted)}
  html body#shoppingcartBody:not(#vbx):not(#vby) #cartContentsDisplay td.cartQuantity input{width:56px !important; min-height:40px !important; text-align:center; display:block !important; margin:0 0 4px !important}
  html body#shoppingcartBody:not(#vbx):not(#vby) #cartContentsDisplay td.cartQuantityUpdate{grid-area:upd}
  html body#shoppingcartBody:not(#vbx):not(#vby) #cartContentsDisplay td.cartUnitDisplay{display:none !important}
  html body#shoppingcartBody:not(#vbx):not(#vby) #cartContentsDisplay td.cartTotalDisplay{grid-area:total; text-align:right !important; font-size:17px; color:var(--vbh-ink)}
  html body#shoppingcartBody:not(#vbx):not(#vby) #cartContentsDisplay td.cartRemoveItemDisplay{grid-area:rm}
  html body:not(#vbx):not(#vby) #shoppingCartDefault .buttonRow{float:none !important; width:100% !important; margin:0 0 10px !important; text-align:center}
  html body:not(#vbx):not(#vby) #shoppingCartDefault .buttonRow > a, html body:not(#vbx):not(#vby) #shoppingCartDefault .buttonRow .cssButton, html body:not(#vbx):not(#vby) #shoppingCartDefault .buttonRow button{display:flex !important; width:100% !important; box-sizing:border-box !important; justify-content:center; align-items:center; margin:0 !important}
  html body:not(#vbx):not(#vby) #shoppingCartDefault > br.clearBoth{display:none !important}
  html body:not(#vbx):not(#vby) #shippingEstimatorContent{margin-top:22px !important}
  html body:not(#vbx):not(#vby) #seQuoteResults tr{display:flex !important; justify-content:space-between; align-items:baseline; gap:12px; flex-wrap:wrap}
  html body:not(#vbx):not(#vby) #seQuoteResults td, html body:not(#vbx):not(#vby) #seQuoteResults th{display:block !important}
  html body:not(#vbx):not(#vby) #seQuoteResults td.seDisplayedAddressLabel{flex:1 1 100%}
}

/* ---------- 37. Phone header (Oct 29): one-line promo bar, whole banner, account + cart row, full-width search, one scrolling row of categories ---------- */
@media (max-width:640px){
  html body:not(#vbx):not(#vby) #vbHeader .vb-util{flex-wrap:nowrap !important; gap:0 !important; padding:8px 12px !important; font-size:12px !important; line-height:1.35 !important}
  html body:not(#vbx):not(#vby) #vbHeader .vb-util > :not(:first-child){display:none !important}
  html body:not(#vbx):not(#vby) #vbHeader .vb-util > :first-child{display:block !important; width:auto !important; text-align:center; white-space:nowrap; font-size:0 !important}
  html body:not(#vbx):not(#vby) #vbHeader .vb-util > :first-child::after{content:"Complimentary shipping over $500 \00B7  contiguous U.S."; font-size:12px; white-space:pre}
  /* Banner: lettering and two bears scaled to fit the width, nothing cropped */
  html body:not(#vbx):not(#vby) #vbHeader .vb-banner__inner{justify-content:center !important; align-items:center !important; gap:2px !important; padding:6px 8px !important; box-sizing:border-box}
  html body:not(#vbx):not(#vby) #vbHeader .vb-banner__word{flex:0 1 52% !important; min-width:0}
  html body:not(#vbx):not(#vby) #vbHeader .vb-banner__word img{width:100% !important; height:auto !important}
  html body:not(#vbx):not(#vby) #vbHeader .vb-banner__bear{flex:0 1 23% !important; min-width:0; width:auto !important}
  html body:not(#vbx):not(#vby) #vbHeader .vb-banner__bear img{width:100% !important; height:auto !important; max-height:84px; object-fit:contain}
  /* Navbar: tools first, then categories */
  html body:not(#vbx):not(#vby) #vbHeader .vb-navbar{padding:10px 16px 0 !important; gap:0 !important}
  html body:not(#vbx):not(#vby) #vbHeader .vb-tools{display:flex !important; flex-wrap:wrap !important; align-items:center !important; justify-content:flex-start !important; gap:4px 0 !important; width:100% !important; margin:0 !important}
  html body:not(#vbx):not(#vby) #vbHeader .vb-tools .vb-search{order:3; flex:1 0 100% !important; width:100% !important; max-width:none !important; margin:6px 0 0 !important}
  html body:not(#vbx):not(#vby) #vbHeader .vb-tools .vb-search #vbq{flex:1 1 auto !important; width:100% !important; max-width:none !important; min-width:0 !important; height:40px !important; font-size:16px !important; box-sizing:border-box}
  html body:not(#vbx):not(#vby) #vbHeader .vb-tools .vb-tool{order:1; padding:8px 14px 8px 0 !important; font-size:14px !important; min-height:0 !important}
  html body:not(#vbx):not(#vby) #vbHeader .vb-tools .vb-cartbtn{order:2; margin-left:auto !important; padding:8px 16px !important; font-size:14px !important; min-height:0 !important}
  /* Categories: one row that scrolls sideways, edge fades to show there is more */
  html body:not(#vbx):not(#vby) #vbHeader .vb-nav{display:flex !important; flex-wrap:nowrap !important; justify-content:flex-start !important; gap:22px !important; width:auto !important; margin:8px -16px 0 !important; padding:10px 16px 12px !important; overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:none; -webkit-overflow-scrolling:touch;
    -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent); mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent)}
  html body:not(#vbx):not(#vby) #vbHeader .vb-nav::-webkit-scrollbar{display:none}
  html body:not(#vbx):not(#vby) #vbHeader .vb-nav a{flex:0 0 auto !important; white-space:nowrap !important; font-size:14px !important; padding:0 !important}
  html body:not(#vbx):not(#vby) #vbHeader .vb-nav a:last-child{padding-right:24px !important}
}

/* ---------- 38. Phone pass, step 2 (Oct 29): swipe cue on the category row; home and category page fixes. Script: jscript/jscript_vb_phone.js ---------- */
/* Headings that wrap no longer overlap (line-height was 22px on 34px type) */
html body:not(#vbx):not(#vby) .vb-home h2{line-height:1.15 !important}
@media (max-width:640px){
  /* Swipe cue: a faint chevron over the faded edge; jscript_vb_phone.js adds .is-end when the row is scrolled to the end */
  html body:not(#vbx):not(#vby) #vbHeader .vb-navbar{position:relative}
  html body:not(#vbx):not(#vby) #vbHeader .vb-navbar::after{content:"\203A"; position:absolute; right:6px; bottom:8px; font:400 26px/1 var(--vbh-sans); color:#DCE1E8; pointer-events:none; transition:opacity .2s}
  html body:not(#vbx):not(#vby) #vbHeader .vb-navbar:has(.vb-nav.is-end)::after{opacity:0}
  html body:not(#vbx):not(#vby) #vbHeader .vb-nav.is-end{-webkit-mask-image:none; mask-image:none}
  /* Card captions (pre-order, last of edition): smaller, dot on the first line */
  html body:not(#vbx):not(#vby) .vb-card .vb-cap{align-items:flex-start !important; font-size:11px !important; letter-spacing:.08em !important; line-height:1.4 !important}
  html body:not(#vbx):not(#vby) .vb-card .vb-cap .vb-dot{flex:0 0 auto; margin-top:.4em}
  /* Quick links: an odd last tile spans both columns */
  html body:not(#vbx):not(#vby) .vb-quick > :last-child:nth-child(odd){grid-column:1 / -1}
  /* Shop by maker: names fit their tiles */
  html body:not(#vbx):not(#vby) .vb-makers__grid{gap:12px !important; padding:0 16px !important; box-sizing:border-box}
  html body:not(#vbx):not(#vby) .vb-makers__grid > a{min-width:0; padding:16px 14px !important}
  html body:not(#vbx):not(#vby) .vb-makers__grid > a strong{font-size:18px !important; line-height:1.2 !important}
  /* Newsletter band: side margins */
  html body:not(#vbx):not(#vby) .vb-news{padding-left:20px !important; padding-right:20px !important; box-sizing:border-box}
  /* Category and product grids: cells fit their column (padding was added outside the width) */
  html body:not(#vbx):not(#vby) .vb-grid{gap:12px !important}
  html body:not(#vbx):not(#vby) .vb-grid > .vb-cell{box-sizing:border-box !important; min-width:0 !important; width:auto !important; padding:10px !important}
  html body:not(#vbx):not(#vby) .vb-grid > .vb-cell.categoryListBoxContents a{font-size:16px !important; line-height:1.25 !important}
  /* Sort control: a plain row, no panel, the menu wide enough to read */
  html body:not(#vbx):not(#vby) #filter-wrapper{background:none !important; border:0 !important; border-radius:0 !important; padding:0 !important; margin:0 0 14px !important; box-shadow:none !important}
  html body:not(#vbx):not(#vby) #filter-wrapper form{display:flex !important; align-items:center !important; justify-content:flex-end !important; gap:12px !important}
  html body:not(#vbx):not(#vby) #filter-wrapper label.inputLabel{display:inline !important; float:none !important; width:auto !important; margin:0 !important}
  html body:not(#vbx):not(#vby) #filter-wrapper select{flex:0 1 220px !important; width:auto !important; min-width:0 !important; margin:0 !important}
  /* Long category descriptions fold to a few lines with Read more (button added by the script) */
  html body:not(#vbx):not(#vby) #categoryDescription.vb-fold{max-height:190px; overflow:hidden; -webkit-mask-image:linear-gradient(#000 60%,transparent); mask-image:linear-gradient(#000 60%,transparent)}
  html body:not(#vbx):not(#vby) #categoryDescription.vb-fold.is-open{max-height:none; -webkit-mask-image:none; mask-image:none}
  html body:not(#vbx):not(#vby) .vb-foldbtn{display:inline-block; margin:6px 0 18px; padding:6px 0; background:none; border:0; border-bottom:1px solid var(--vbh-navy); color:var(--vbh-navy); font:600 14px/1.3 var(--vbh-sans); cursor:pointer}
}

/* ---------- 39. Phones (Oct 29): home intro and newsletter band centered to match their centered headings ---------- */
/* tpl_index_default.php splits the eyebrow into text, a dot separator and the place, so phones can put Sarasota on its own line */
@media (max-width:640px){
  html body:not(#vbx):not(#vby) .vb-hero__inner{padding-left:20px !important; padding-right:20px !important; box-sizing:border-box}
  html body:not(#vbx):not(#vby) .vb-hero__text{text-align:center !important; align-items:center !important}
  html body:not(#vbx):not(#vby) .vb-hero .vb-eyebrow{display:block !important; text-align:center !important; line-height:1.6 !important; font-size:12px !important; letter-spacing:.14em !important; text-wrap:balance}
  html body:not(#vbx):not(#vby) .vb-hero .vb-eyebrow__sep{display:none}
  html body:not(#vbx):not(#vby) .vb-hero .vb-eyebrow__place{display:flex; align-items:center; justify-content:center; gap:12px; margin-top:6px}
  html body:not(#vbx):not(#vby) .vb-hero .vb-eyebrow__place::before, html body:not(#vbx):not(#vby) .vb-hero .vb-eyebrow__place::after{content:""; width:28px; height:1px; background:currentColor; opacity:.6}
  html body:not(#vbx):not(#vby) .vb-hero__text p{text-align:center !important}
  html body:not(#vbx):not(#vby) .vb-hero__ctas .vb-btn{justify-content:center !important; text-align:center !important}
  html body:not(#vbx):not(#vby) .vb-news__inner, html body:not(#vbx):not(#vby) .vb-news__inner h2, html body:not(#vbx):not(#vby) .vb-news__inner p{text-align:center !important; text-wrap:balance}
  html body:not(#vbx):not(#vby) .vb-news__inner .vb-btn{justify-content:center !important; text-align:center !important}
}

/* ---------- 40. Phones (Oct 29): home hero starts higher; product page note line and photo ---------- */
@media (max-width:640px){
  /* Paul: move "Thirty years of collecting" up a line or two (top padding was 64px) */
  html body:not(#vbx):not(#vby) .vb-hero{padding-top:30px !important}
  /* Product page: the three short notes wrap centered, without a stray dot starting a line */
  html body:not(#vbx):not(#vby) .vb-pp__noteline{display:flex !important; flex-wrap:wrap !important; justify-content:center !important; gap:6px 18px !important; text-align:center !important}
  html body:not(#vbx):not(#vby) .vb-pp__noteline .vb-sep{display:none !important}
  /* Product photo a little larger inside its mat */
  html body:not(#vbx):not(#vby) .vb-pp__plate img{max-width:88% !important; max-height:88% !important}
}

/* ---------- 41. Phones (Oct 29): checkout order totals as label / amount rows; full-width Confirm Order; cart button spacing ---------- */
/* (Section 36's cart grid is now limited to body#shoppingcartBody; it had also caught the checkout table and pushed the totals over the comments box.) */
@media (max-width:640px){
  html body#checkoutoneBody:not(#vbx):not(#vby) #cartOrderTotals{display:table-row !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #orderTotalDivs{display:table-cell !important; width:auto !important; padding:8px 0 0 !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #orderTotalDivs > br.clearBoth{display:none !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #orderTotalDivs > div{display:flex !important; justify-content:space-between !important; align-items:baseline !important; gap:16px; padding:7px 0 !important; margin:0 !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #orderTotalDivs > div > div{float:none !important; width:auto !important; margin:0 !important; padding:0 !important; text-align:left !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #orderTotalDivs .lineTitle{order:1; color:var(--vbh-muted) !important; font-size:15px !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #orderTotalDivs .totalBox{order:2; text-align:right !important; font-size:15px !important; color:var(--vbh-ink) !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #orderTotalDivs #ottotal{border-top:1px solid var(--vbh-line); margin-top:4px !important; padding-top:10px !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #orderTotalDivs #ottotal > div{font-weight:600 !important; font-size:17px !important; color:var(--vbh-ink) !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutOneSubmit{float:none !important; width:100% !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutOneSubmit .cssButton{display:flex !important; align-items:center !important; justify-content:center !important; height:48px !important; margin-top:14px !important; width:100% !important; box-sizing:border-box !important; text-align:center !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutOneEmail{text-align:center !important}
  html body#shoppingcartBody:not(#vbx):not(#vby) #shoppingCartDefault .buttonRow.back{margin-top:10px !important}
}

/* ---------- 42. Phones (Oct 29): breadcrumb lines up with the page content (it sat 24px further in) ---------- */
@media (max-width:640px){
  html body:not(#vbx):not(#vby) #navBreadCrumb{padding-left:0 !important; padding-right:0 !important}
}

/* ---------- 43. Checkout on phones, from Paul's guest-checkout iPhone screenshots (Oct 29). Previewed with responsive_mobile.css, the sheet phones get. ---------- */
/* All widths: the step being edited is no longer a raised card with a grey shadow, and the steps waiting their turn fade without a grey tint */
html body#checkoutoneBody:not(#vbx):not(#vby) .opc-view{box-shadow:none !important}
html body#checkoutoneBody:not(#vbx):not(#vby) .opc-disabled{background:transparent !important; opacity:.45 !important}
html body#checkoutoneBody:not(#vbx):not(#vby) .opc-overlay.active{background:transparent !important}
/* Phones: contact and address fields full width, labels above, one left edge; shipping methods full width as name + price rows; comments box and totals full width */
@media (max-width:640px){
  html body#checkoutoneBody:not(#vbx):not(#vby) :is(#checkoutOneGuestInfo,#checkoutOneBillto,#checkoutOneShipto){padding-left:0 !important; padding-right:0 !important; margin-left:0 !important; margin-right:0 !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) :is(#checkoutOneGuestInfo,#checkoutOneBillto,#checkoutOneShipto) fieldset{padding:0 !important; margin:0 !important; border:0 !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) :is(#checkoutOneGuestInfo,#checkoutOneBillto,#checkoutOneShipto) :is([id^=address-],[id^=choices-],[id^=messages-],p,.information,#instructions){margin-left:0 !important; margin-right:0 !important; padding-left:0 !important; padding-right:0 !important; text-align:left !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) :is(#checkoutOneGuestInfo,#checkoutOneBillto,#checkoutOneShipto) label.inputLabel{float:none !important; display:block !important; width:auto !important; margin:0 0 6px !important; padding:0 !important; text-align:left !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) :is(#checkoutOneGuestInfo,#checkoutOneBillto,#checkoutOneShipto) :is(input[type=text],input[type=email],input[type=tel],input:not([type]),select){float:none !important; width:100% !important; max-width:none !important; margin:0 0 16px !important; box-sizing:border-box !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) :is(#checkoutOneGuestInfo,#checkoutOneBillto,#checkoutOneShipto) span.alert, html body#checkoutoneBody:not(#vbx):not(#vby) :is(#checkoutOneGuestInfo,#checkoutOneBillto,#checkoutOneShipto) br{display:none !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) :is(#checkoutOneGuestInfo,#checkoutOneBillto,#checkoutOneShipto) [id^=address-] > .floatingBox{float:none !important; width:auto !important; margin:0 !important; padding:0 !important; text-align:left !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) :is(#checkoutOneGuestInfo,#checkoutOneBillto,#checkoutOneShipto) [id^=address-] > .floatingBox.forward{margin-top:10px !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) :is(#checkoutOneGuestInfo,#checkoutOneBillto,#checkoutOneShipto) .buttonRow{float:none !important; width:100% !important; margin:4px 0 0 !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) :is(#checkoutOneGuestInfo,#checkoutOneBillto,#checkoutOneShipto) .buttonRow .cssButton{display:flex !important; align-items:center; justify-content:center; width:100% !important; height:46px !important; box-sizing:border-box}
  html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutShippingMethod{float:none !important; width:100% !important; max-width:none !important; margin-left:0 !important; margin-right:0 !important; box-sizing:border-box}
  html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutShippingChoices{margin:0 !important; width:100% !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutShippingChoices > fieldset{display:grid !important; grid-template-columns:1fr auto !important; align-items:center !important; column-gap:16px; padding:8px 0 !important; margin:0 !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutShippingChoices > fieldset > legend{float:left !important; grid-column:1 / -1; grid-row:1; width:100% !important; padding:0 !important; margin:0 0 6px !important; text-align:left !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutShippingChoices > fieldset > .custom-radio{grid-column:1; grid-row:2; margin:0 !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutShippingChoices > fieldset > .important{grid-column:2; grid-row:2; float:none !important; margin:0 !important; text-align:right !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutShippingChoices > fieldset > br{display:none !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutComments :is(textarea,fieldset){margin-left:0 !important; margin-right:0 !important; width:100% !important; max-width:none !important; box-sizing:border-box !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutComments fieldset{padding:0 !important; border:0 !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #orderTotalDivs{width:100% !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #orderTotalDivs > div{width:100% !important; max-width:none !important; box-sizing:border-box !important; margin-right:0 !important; padding-right:0 !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #orderTotalDivs > div > div{min-width:0 !important}
}
/* 43b. The phone stylesheet narrows the address form (90%) and its fieldset (98%) */
@media (max-width:640px){
  html body#checkoutoneBody:not(#vbx):not(#vby) :is(#checkoutOneGuestInfo,#checkoutOneBillto,#checkoutOneShipto) :is(fieldset,[id^=address-]){width:100% !important; max-width:none !important; box-sizing:border-box !important}
}

/* ---------- 44. Phones (Oct 29): account tables ---------- */
@media (max-width:640px){
  /* An older stacked-table rule put a 20px white border under the last cell of each order (a white strip under View) */
  html body:not(#vbx):not(#vby) .vb-acct__table td:last-child{border-bottom:0 !important}
}
@media (max-width:600px){
  /* Layaway schedule: "of $82.66" sits under the amount, not under the AMOUNT label */
  html body:not(#vbx):not(#vby) .vb-acct__table td[data-label] .vb-lw__of{margin-left:96px}
}

/* ---------- 45. Checkout on phones (Oct 29, Paul): product name no longer runs into its price; price lines up with the totals ---------- */
@media (max-width:640px){
  html body#checkoutoneBody:not(#vbx):not(#vby) #cartContentsDisplay td.cartProductDisplay{white-space:normal !important; min-width:0 !important; width:auto !important; padding-right:16px !important; overflow-wrap:anywhere}
  html body#checkoutoneBody:not(#vbx):not(#vby) #cartContentsDisplay td.cartTotalDisplay{white-space:nowrap !important; width:1% !important; padding-right:0 !important; text-align:right !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #cartContentsDisplay tr.cartTableHeading th:last-child{padding-right:0 !important}
}

/* ---------- 46. Phones (Oct 29): layaway "Make a payment" full width, like Checkout and Confirm Order ---------- */
@media (max-width:640px){
  html body#vblayawayBody:not(#vbx):not(#vby) :is(a,button).vb-btn.vb-btn--solid{display:flex !important; width:100% !important; margin-left:0 !important; margin-right:0 !important; box-sizing:border-box !important; justify-content:center !important; align-items:center !important}
  html body#vblayawayBody:not(#vbx):not(#vby) p:has(> .vb-btn--solid){padding-left:0 !important; padding-right:0 !important}
}

/* ---------- 47. Checkout totals on phones (Oct 29, Paul): a long shipping label wraps; its amount stays at the right edge (Safari pushed it past) ---------- */
@media (max-width:640px){
  html body#checkoutoneBody:not(#vbx):not(#vby) #orderTotalDivs .lineTitle{flex:1 1 auto !important; min-width:0 !important}
  html body#checkoutoneBody:not(#vbx):not(#vby) #orderTotalDivs .totalBox{flex:0 0 auto !important; white-space:nowrap !important}
}

/* ---------- 48. Search results and listings, all widths (Oct 29): sort control as a plain row (no panel); "Displaying" left and page numbers right; breadcrumb lines up with the heading. tpl_search_result_default.php (new override) adds the "Search" eyebrow and "Results for ..." heading ---------- */
html body:not(#vbx):not(#vby) #filter-wrapper{background:none !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; padding:0 !important; margin:0 0 14px !important}
html body:not(#vbx):not(#vby) #filter-wrapper form{display:flex !important; align-items:center !important; justify-content:flex-end !important; gap:12px !important; flex-wrap:wrap}
html body:not(#vbx):not(#vby) #filter-wrapper label.inputLabel{display:inline !important; float:none !important; width:auto !important; margin:0 !important}
html body:not(#vbx):not(#vby) #filter-wrapper select{width:auto !important; min-width:200px; margin:0 !important}
html body:not(#vbx):not(#vby) .vb-search__eyebrow{display:block !important; margin:18px 0 6px !important}
html body:not(#vbx):not(#vby) #productListing .prod-list-wrap{padding-left:0 !important; padding-right:0 !important; display:flex !important; justify-content:space-between !important; align-items:center !important; flex-wrap:wrap; gap:10px 20px}
html body:not(#vbx):not(#vby) #productListing .prod-list-wrap > *{float:none !important; margin:0 !important; width:auto !important}
html body:not(#vbx):not(#vby) #productListing .prod-list-wrap > br{display:none !important}
html body:not(#vbx):not(#vby) #productListing .prod-list-wrap > .navSplitPagesResult{order:-1; text-align:left !important}
html body:not(#vbx):not(#vby) #productListing .prod-list-wrap > .navSplitPagesLinks{margin-left:auto !important; text-align:right !important}
html body:not(#vbx):not(#vby) #navBreadCrumb{padding-left:0 !important; padding-right:0 !important}

/* ---------- 49. Advanced search form (shown after a search with no matches), Oct 29: one left edge, hairline-topped sections, two columns on computers ---------- */
html body#searchBody:not(#vbx):not(#vby) #searchDefault fieldset{padding:0 !important; margin:0 0 22px !important; border:0 !important; border-top:1px solid var(--vbh-line) !important; padding-top:16px !important}
html body#searchBody:not(#vbx):not(#vby) #searchDefault fieldset > *:not(legend){margin-left:0 !important; padding-left:0 !important}
html body#searchBody:not(#vbx):not(#vby) #searchDefault .centeredContent{text-align:left !important; display:flex !important; align-items:center !important; gap:10px 18px !important; flex-wrap:wrap !important; clear:both}
html body#searchBody:not(#vbx):not(#vby) #searchDefault input[name=keyword]{flex:1 1 280px; max-width:460px; width:auto !important; margin:0 !important}
html body#searchBody:not(#vbx):not(#vby) #searchDefault input[name=keyword]{background:var(--vbh-panel) !important; border:1px solid var(--vbh-line) !important; border-radius:8px !important; padding:10px 12px !important; min-height:44px; box-sizing:border-box; font:400 16px var(--vbh-sans) !important; color:var(--vbh-ink) !important; box-shadow:none !important}
html body#searchBody:not(#vbx):not(#vby) #searchDefault input[name=keyword]:focus{outline:none !important; border-color:var(--vbh-navy) !important; box-shadow:0 0 0 1px var(--vbh-navy) !important}
html body#searchBody:not(#vbx):not(#vby) #searchDefault .floatLeft{float:none !important; margin:0 0 10px !important; padding:0 !important}
html body#searchBody:not(#vbx):not(#vby) #searchDefault select{width:100% !important; max-width:340px !important; margin:0 !important}
html body#searchBody:not(#vbx):not(#vby) #searchDefault label.inputLabel{float:none !important; display:block !important; width:auto !important; margin:10px 0 6px !important; padding:0 !important; text-align:left !important}
html body#searchBody:not(#vbx):not(#vby) #searchDefault :is(input[name=pfrom],input[name=pto],input[name=dfrom],input[name=dto]){display:block !important; width:100% !important; max-width:220px !important; margin:0 !important}
html body#searchBody:not(#vbx):not(#vby) #searchDefault fieldset.floatingBox{width:calc(50% - 20px) !important}
html body#searchBody:not(#vbx):not(#vby) #searchDefault fieldset.floatingBox.back{margin-right:40px !important}
html body#searchBody:not(#vbx):not(#vby) #searchDefault br.clearBoth{display:none}
@media (max-width:640px){html body#searchBody:not(#vbx):not(#vby) #searchDefault fieldset.floatingBox{float:none !important; width:100% !important; margin-right:0 !important}}

/* ---------- 50. Contact us (Oct 29): shop details left, form right (stacked on phones); labels above fields; one Send button under the form. tpl_contact_us_default.php (new override) empties the stray "main_page" name and sends to the single contact address without a one-choice picker ---------- */
html body#contactusBody:not(#vbx):not(#vby) #contactUsDefault > form{display:grid !important; grid-template-columns:minmax(220px,300px) minmax(0,1fr) !important; column-gap:56px !important; padding:0 !important; margin:28px 0 0 !important; align-items:start}
html body#contactusBody:not(#vbx):not(#vby) #contactUsDefault > form > :is(address,#contactUsNoticeContent){grid-column:1; margin:0 !important; padding:0 !important; width:auto !important; float:none !important}
html body#contactusBody:not(#vbx):not(#vby) #contactUsDefault > form > #contactUsNoticeContent{margin-top:20px !important}
html body#contactusBody:not(#vbx):not(#vby) #contactUsNoticeContent, html body#contactusBody:not(#vbx):not(#vby) #contactUsNoticeContent p{padding-left:0 !important; padding-right:0 !important; margin-left:0 !important}
html body#contactusBody:not(#vbx):not(#vby) #contactUsDefault > form > #contactUsForm{grid-column:2; grid-row:1 / span 3; width:auto !important; float:none !important}
html body#contactusBody:not(#vbx):not(#vby) #contactUsDefault > form > .buttonRow.forward{grid-column:2; float:none !important; justify-self:start; margin:4px 0 0 !important}
html body#contactusBody:not(#vbx):not(#vby) #contactUsDefault > form > .buttonRow.back{display:none !important}
html body#contactusBody:not(#vbx):not(#vby) #contactUsForm{border:0 !important; padding:0 !important; margin:0 !important}
html body#contactusBody:not(#vbx):not(#vby) #contactUsForm legend{float:none !important; width:100% !important; padding:0 0 10px !important; margin:0 0 18px !important; border-bottom:1px solid var(--vbh-line)}
html body#contactusBody:not(#vbx):not(#vby) #contactUsForm label.inputLabel{float:none !important; display:block !important; width:auto !important; margin:0 0 6px !important; padding:0 !important; text-align:left !important}
html body#contactusBody:not(#vbx):not(#vby) #contactUsForm label:not(.inputLabel):not(.checkboxLabel){display:block !important; float:none !important; margin:0 0 6px !important; padding:0 !important; font:600 12px var(--vbh-sans) !important; letter-spacing:.1em !important; text-transform:uppercase !important; color:var(--vbh-muted) !important}
html body#contactusBody:not(#vbx):not(#vby) #contactUsForm :is(input[type=text],input[type=email],input[type=tel],input:not([type]),textarea){float:none !important; display:block !important; width:100% !important; max-width:560px !important; margin:0 0 18px !important; box-sizing:border-box !important}
html body#contactusBody:not(#vbx):not(#vby) #contactUsForm textarea{min-height:150px; margin-bottom:6px !important}
html body#contactusBody:not(#vbx):not(#vby) #contactUsForm :is(span.alert,div.alert.forward,br.clearBoth){display:none !important}
@media (max-width:640px){
  html body#contactusBody:not(#vbx):not(#vby) #contactUsDefault > form{grid-template-columns:1fr !important}
  html body#contactusBody:not(#vbx):not(#vby) #contactUsDefault > form > *{grid-column:1 !important; grid-row:auto !important}
  html body#contactusBody:not(#vbx):not(#vby) #contactUsDefault > form > #contactUsForm{margin-top:24px !important}
  html body#contactusBody:not(#vbx):not(#vby) #contactUsDefault > form > .buttonRow.forward{justify-self:stretch}
  html body#contactusBody:not(#vbx):not(#vby) #contactUsDefault > form > .buttonRow.forward .cssButton{display:flex !important; width:100% !important; justify-content:center; box-sizing:border-box}
}

/* ---------- 51. Forgotten password (Oct 29): page-style heading, label above a 560px field, button under it, Back as a quiet text link ---------- */
html body#passwordforgottenBody:not(#vbx):not(#vby) #passwordForgotten fieldset{border:0 !important; padding:0 !important; margin:0 !important; max-width:560px !important; min-width:0 !important}
html body#passwordforgottenBody:not(#vbx):not(#vby) #passwordForgotten legend{float:none !important; display:block !important; width:100% !important; padding:24px 0 0 !important; margin:0 0 10px !important; font:400 40px/1.1 var(--vbh-serif) !important; letter-spacing:-.01em; color:var(--vbh-ink) !important; border:0 !important}
html body#passwordforgottenBody:not(#vbx):not(#vby) #passwordForgottenMainContent{padding:0 !important; margin:0 0 22px !important; color:var(--vbh-muted) !important; font-size:16px !important; line-height:1.6 !important}
html body#passwordforgottenBody:not(#vbx):not(#vby) #passwordForgotten :is(div.alert.forward,br.clearBoth){display:none !important}
html body#passwordforgottenBody:not(#vbx):not(#vby) #passwordForgotten label[for=email-address]{float:none !important; display:block !important; width:auto !important; margin:0 0 6px !important; padding:0 !important; font:600 12px var(--vbh-sans) !important; letter-spacing:.1em !important; text-transform:uppercase !important; color:var(--vbh-muted) !important}
html body#passwordforgottenBody:not(#vbx):not(#vby) #passwordForgotten #email-address{float:none !important; display:block !important; width:100% !important; max-width:none !important; margin:0 !important; box-sizing:border-box !important}
html body#passwordforgottenBody:not(#vbx):not(#vby) #passwordForgotten .buttonRow.forward{float:none !important; max-width:560px; margin:18px 0 0 !important; text-align:left !important}
html body#passwordforgottenBody:not(#vbx):not(#vby) #passwordForgotten .buttonRow.back{float:none !important; margin:14px 0 0 !important}
html body#passwordforgottenBody:not(#vbx):not(#vby) #passwordForgotten .buttonRow.back .cssButton{background:none !important; border:0 !important; color:var(--vbh-navy) !important; padding:0 !important; height:auto !important; min-height:0 !important; font:500 14px var(--vbh-sans) !important; box-shadow:none !important}
html body#passwordforgottenBody:not(#vbx):not(#vby) #passwordForgotten .buttonRow.back .cssButton::before{content:"\2190  "; white-space:pre}
@media (max-width:640px){html body#passwordforgottenBody:not(#vbx):not(#vby) #passwordForgotten .buttonRow.forward .cssButton{width:100% !important}}

/* ---------- 52. Privacy and Conditions (Oct 29): 720px reading column, 16px text with 1.7 line height, Back as a quiet text link ---------- */
html body:is(#privacyBody,#conditionsBody):not(#vbx):not(#vby) .centerColumn > .content{max-width:720px !important; font-size:16px !important; line-height:1.7 !important; color:var(--vbh-ink) !important; padding:0 !important; margin:0 !important}
html body:is(#privacyBody,#conditionsBody):not(#vbx):not(#vby) .centerColumn > .content :is(p,div){margin:0 0 16px !important; padding:0 !important}
html body:is(#privacyBody,#conditionsBody):not(#vbx):not(#vby) .centerColumn > .content strong{font-weight:600}
html body:is(#privacyBody,#conditionsBody):not(#vbx):not(#vby) .centerColumn > .buttonRow.back{float:none !important; margin:22px 0 0 !important}
html body:is(#privacyBody,#conditionsBody):not(#vbx):not(#vby) .centerColumn > .buttonRow.back .cssButton{background:none !important; border:0 !important; color:var(--vbh-navy) !important; padding:0 !important; height:auto !important; min-height:0 !important; font:500 14px var(--vbh-sans) !important; box-shadow:none !important}
html body:is(#privacyBody,#conditionsBody):not(#vbx):not(#vby) .centerColumn > .buttonRow.back .cssButton::before{content:"\2190  "; white-space:pre}

/* ---------- 53. Privacy and Conditions content (Oct 29, Paul approved the new text): section headings, lists, links, last-updated line ---------- */
html body:is(#privacyBody,#conditionsBody):not(#vbx):not(#vby) .centerColumn > .content h3{font:400 22px/1.25 var(--vbh-serif) !important; color:var(--vbh-ink) !important; margin:30px 0 8px !important; padding:0 !important; letter-spacing:-.005em; text-transform:none !important}
html body:is(#privacyBody,#conditionsBody):not(#vbx):not(#vby) .centerColumn > .content ul{margin:0 0 16px !important; padding:0 0 0 20px !important; list-style:disc outside !important}
html body:is(#privacyBody,#conditionsBody):not(#vbx):not(#vby) .centerColumn > .content li{margin:0 0 8px !important; padding:0 !important}
html body:is(#privacyBody,#conditionsBody):not(#vbx):not(#vby) .centerColumn > .content a{color:var(--vbh-navy) !important; text-decoration:underline; text-underline-offset:2px}
html body:is(#privacyBody,#conditionsBody):not(#vbx):not(#vby) .centerColumn > .content .vb-updated{margin-top:30px !important; color:var(--vbh-muted) !important; font-size:14px !important}

/* 54. Village Bears hanging sign above the hero buttons (Oct 29 2026) */
html body:not(#vbx):not(#vby) .vb-hero__ctas .vb-hero__sign{display:block !important; object-fit:contain !important; max-width:100% !important; padding:0 !important; border:0 !important; background:none !important; box-shadow:none !important}
@media (min-width:768px){html body:not(#vbx):not(#vby) .vb-hero__ctas{display:grid !important; grid-template-columns:auto auto !important; justify-content:center !important; column-gap:14px !important; row-gap:0 !important}
html body:not(#vbx):not(#vby) .vb-hero__ctas .vb-hero__sign{grid-column:1 / -1 !important; justify-self:center !important; width:auto !important; height:205px !important; margin:0 0 22px !important}}
@media (max-width:767px){html body:not(#vbx):not(#vby) .vb-hero__ctas .vb-hero__sign{flex:0 0 100% !important; width:100% !important; height:150px !important; margin:4px 0 18px !important}}

/* 55. Checkout payment area back to the storyboard (Oct 30 2026, styling chat). Look only: no PayPal / OPC markup or script changed.
   Payment = stacked rows (PayPal, card + its boxes, check last), 15 px navy radio, ~520 px wide; store credit line compact; Edit as text links. */
html body#checkoutoneBody:not(#vbx):not(#vby) #checkoutPayment #checkoutPaymentMethod fieldset > legend, html body:not(#vbx):not(#vby) #checkoutPayment #checkoutPaymentMethod fieldset > p.important{text-align:left !important;float:none !important;width:100% !important;margin-left:0 !important;margin-right:0 !important}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo{display:flex !important;flex-direction:column !important;align-items:stretch !important;max-width:520px !important;margin:10px 0 0 !important;text-align:left !important}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-paygrid{display:contents !important}
html body:not(#vbx):not(#vby) #checkoutPayment #ppr-choice-paypal{order:1}
html body:not(#vbx):not(#vby) #checkoutPayment #ppr-choice-card{order:2}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-ccfields{order:3}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-paychoice.vb-ck{order:4}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-paychoice{display:flow-root !important;flex:none !important;width:auto !important;max-width:none !important;height:auto !important;min-height:0 !important;max-height:none !important;margin:0 !important;padding:0 !important;border:0 !important;border-bottom:1px solid #C4C8CE !important;position:relative;background:none !important;box-shadow:none !important}
html body:not(#vbx):not(#vby) #checkoutPayment #ppr-choice-paypal{border-top:1px solid #C4C8CE !important}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-paychoice input.ppr-choice{position:absolute !important;opacity:0 !important;width:1px !important;height:1px !important;margin:0 !important;pointer-events:none}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-paychoice label{display:flex !important;align-items:center !important;gap:14px !important;float:none !important;position:static !important;width:100% !important;height:auto !important;min-height:0 !important;margin:0 !important;padding:14px 0 !important;border:0 !important;border-radius:0 !important;background:none !important;box-shadow:none !important;box-sizing:border-box;cursor:pointer;text-align:left !important}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-paychoice label::before{content:"";flex:none;width:15px;height:15px;box-sizing:border-box;border-radius:999px;border:1.33px solid #123560;background:radial-gradient(circle,#123560 0 3.5px,transparent 4px) center/0 0 no-repeat}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-paychoice input.ppr-choice:checked + label::before, html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-paychoice.vb-sel label::before{background-size:100% 100%}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-paychoice input.ppr-choice:focus-visible + label::before{outline:2px solid #123560;outline-offset:2px}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-pp-btn, html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-card-btn{flex:1 !important;display:flex !important;align-items:center !important;justify-content:space-between !important;gap:12px !important;min-height:0 !important;height:auto !important;padding:0 !important;margin:0 !important;background:none !important;border:0 !important;border-radius:0 !important;box-shadow:none !important;color:#15202E !important;font-weight:400 !important;font-style:normal !important}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-pp-btn{font-size:0 !important}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-card-btn{flex-direction:row !important;flex-wrap:nowrap !important;justify-content:space-between !important}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-pp-btn img{display:none !important}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-pp-btn::before{content:"PayPal";font-size:16px;line-height:1.4;color:#15202E}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-pp-btn::after{content:"";flex:none;width:32px;height:20px;background:url(../images/cards/paypal.svg) center/contain no-repeat}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-card-txt{font-size:16px !important;font-weight:400 !important;color:#15202E !important}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-card-logos{gap:6px !important}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-card-logos img{height:20px !important;width:auto !important;border-radius:3px}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-ck-btn img{display:none !important}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-ck-btn > span{flex:1;display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:16px;font-weight:400;color:#15202E}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-ck-btn > span::after{content:"Payable to Village Bears";font-size:13px;color:#5F6672}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-ccfields{margin:4px 0 16px 29px !important;justify-content:start !important;text-align:left !important;max-width:440px !important}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-ccfields select, html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-ccfields input.ppr-cc{height:44px !important;min-height:44px !important;font-size:16px !important;box-sizing:border-box !important}
html body:not(#vbx):not(#vby) #checkoutPayment .checkoutOneGv .vb-gv__line{font-size:16px !important}
html body:not(#vbx):not(#vby) #checkoutPayment .checkoutOneGv .vb-gv__amt{margin:8px 0 0 29px !important;gap:10px !important;font-size:15px !important}
html body:not(#vbx):not(#vby) #checkoutPayment .checkoutOneGv .vb-gv__amt input{width:96px !important;height:36px !important;min-height:36px !important;padding:0 10px !important;font-size:15px !important;border:1px solid #C4C8CE !important;border-radius:8px !important;background:#EEF0F2 !important;box-shadow:none !important;box-sizing:border-box !important}
html body:not(#vbx):not(#vby) #checkoutPayment .checkoutOneGv .vb-gv__amt input:focus{border-color:#123560 !important;box-shadow:0 0 0 1px #123560 !important;outline:none !important}
html body:not(#vbx):not(#vby) #checkoutPayment .checkoutOneGv .vb-gv__amt .vb-btn{display:inline-flex !important;align-items:center !important;height:36px !important;min-height:36px !important;padding:0 16px !important;font-size:14px !important;font-weight:600 !important;border:1.5px solid #123560 !important;border-radius:8px !important;background:transparent !important;color:#123560 !important}
html body:not(#vbx):not(#vby) #checkoutPayment .checkoutOneGv .vb-gv__off, html body:not(#vbx):not(#vby) #checkoutPayment .checkoutOneGv .vb-gv__codelink{color:#123560 !important;font-size:14px !important;text-decoration:underline !important;text-underline-offset:2px}
html body:not(#vbx):not(#vby) #checkoutPayment .cssButton.small_edit, html body:not(#vbx):not(#vby) #checkoutPayment .cssButton.small_edit:hover{display:inline !important;height:auto !important;min-height:0 !important;padding:0 !important;margin:0 !important;border:0 !important;border-radius:0 !important;background:none !important;box-shadow:none !important;color:#123560 !important;font-size:14px !important;font-weight:400 !important;letter-spacing:0 !important;text-transform:none !important;text-decoration:underline !important;text-underline-offset:2px;cursor:pointer}

html body:not(#vbx):not(#vby):not(#vbz) #checkoutPayment #checkoutPaymentMethod .vb-ccfields #paypalr-cc-expires-month, html body:not(#vbx):not(#vby):not(#vbz) #checkoutPayment #checkoutPaymentMethod .vb-ccfields #paypalr-cc-expires-year, html body:not(#vbx):not(#vby):not(#vbz) #checkoutPayment #checkoutPaymentMethod .vb-ccfields #paypalr-cc-cvv{height:44px !important;min-height:44px !important;line-height:normal !important;padding:0 12px !important;font-size:16px !important}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .ppr-choice:focus-visible + label > span, html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-paychoice label > span{outline:none !important}
html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-ccfields{margin-bottom:12px !important}
@media (max-width:600px){html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-card-logos{gap:4px !important;flex:none}html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-card-logos img{height:15px !important}html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-card-txt{white-space:nowrap}html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-ccfields{margin-left:0 !important}html body:not(#vbx):not(#vby) #checkoutPayment .checkoutOneGv .vb-gv__line{margin-left:0 !important;padding-left:0 !important}html body:not(#vbx):not(#vby) #checkoutPayment .checkoutOneGv .vb-gv__amt{margin-left:0 !important}}
@media (max-width:600px){html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-paychoice label{gap:10px !important}html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-card-btn{gap:6px !important;min-width:0}html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-card-logos{gap:3px !important}html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-card-logos img{height:14px !important}}
@media (max-width:600px){html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo{max-width:none !important;width:100% !important}html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-ccfields{max-width:none !important;width:100% !important}html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-ck-btn > span::after{display:none}html body:not(#vbx):not(#vby) #checkoutPayment .ccinfo .vb-ccfields select{padding:0 8px !important}}
@media (max-width:600px){html body:not(#vbx):not(#vby):not(#vbz) #checkoutPayment #checkoutPaymentMethod .vb-ccfields #paypalr-cc-expires-month, html body:not(#vbx):not(#vby):not(#vbz) #checkoutPayment #checkoutPaymentMethod .vb-ccfields #paypalr-cc-expires-year{padding:0 4px 0 8px !important;font-size:15px !important}}

/* 56. Thank-you page store credit note (Oct 30 2026, styling chat): replaces the grey Gift Certificate panel; dot + small caps + one sentence. Template: tpl_modules_send_or_spend.php (village_bears). */
html body:not(#vbx):not(#vby) #sendSpendWrapper{background:none !important;border:0 !important;border-top:1px solid #C4C8CE !important;border-bottom:1px solid #C4C8CE !important;border-radius:0 !important;box-shadow:none !important;padding:16px 0 !important;margin:20px 0 !important}
html body:not(#vbx):not(#vby) #sendSpendWrapper .vb-credit-note{display:flex;flex-direction:column;gap:6px;margin:0 !important;padding:0 !important}
html body:not(#vbx):not(#vby) #sendSpendWrapper .vb-credit-note__label{display:inline-flex;align-items:center;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#123560}
html body:not(#vbx):not(#vby) #sendSpendWrapper .vb-credit-note__label::before{content:"";width:7px;height:7px;border-radius:999px;background:#123560;margin-right:6px}
html body:not(#vbx):not(#vby) #sendSpendWrapper .vb-credit-note__text{font-size:15px;line-height:1.5;color:#15202E}
html body:not(#vbx):not(#vby) #checkoutPayment .checkoutOneGv .vb-gv__line{margin-left:0 !important;padding-left:0 !important;gap:14px !important}
html body:not(#vbx):not(#vby) #checkoutPayment .checkoutOneGv .vb-gv{margin-left:0 !important;padding-left:0 !important}
/* 57. No gift certificate codes (Oct 30 2026, Paul): the "Have a gift certificate code?" link and its code box are hidden; store credit only. */
html body:not(#vbx):not(#vby) #checkoutPayment .checkoutOneGv .vb-gv__codelink, html body:not(#vbx):not(#vby) #checkoutPayment .checkoutOneGv .vb-gv__code{display:none !important}
/* 58. Checkout order totals (Oct 30 2026, styling chat): quiet labels, Total in Fraunces over one hairline, reward points as a small note. */
html body:not(#vbx):not(#vby) #checkoutPayment #orderTotalDivs {padding-top:6px !important}
html body:not(#vbx):not(#vby) #checkoutPayment #orderTotalDivs > div{display:flex !important;justify-content:flex-start !important;align-items:baseline !important;gap:24px !important;padding:3px 0 !important;height:auto !important;min-height:0 !important;line-height:1.45 !important;margin:0 !important;flex-direction:row-reverse !important;float:none !important;clear:both}
html body:not(#vbx):not(#vby) #checkoutPayment #orderTotalDivs > div > div{float:none !important;margin:0 !important;padding:0 !important;width:auto !important;height:auto !important;min-height:0 !important;line-height:1.45 !important;font-size:15px !important}
html body:not(#vbx):not(#vby) #checkoutPayment #orderTotalDivs > div .lineTitle{color:#5F6672 !important;text-align:right !important}
html body:not(#vbx):not(#vby) #checkoutPayment #orderTotalDivs > div .totalBox{color:#15202E !important;min-width:90px;text-align:right !important}
html body:not(#vbx):not(#vby) #checkoutPayment #orderTotalDivs > #ottotal{border-top:1px solid #C4C8CE !important;margin-top:8px !important;padding-top:12px !important}
html body:not(#vbx):not(#vby) #checkoutPayment #orderTotalDivs > #ottotal .lineTitle, html body:not(#vbx):not(#vby) #checkoutPayment #orderTotalDivs > #ottotal .totalBox{font-family:var(--vb-serif, Fraunces, Georgia, serif) !important;font-size:20px !important;color:#15202E !important;font-weight:400 !important}
html body:not(#vbx):not(#vby) #checkoutPayment #orderTotalDivs > #otrewardpointsdisplay .lineTitle, html body:not(#vbx):not(#vby) #checkoutPayment #orderTotalDivs > #otrewardpointsdisplay .totalBox{font-size:13px !important;color:#5F6672 !important}
html body:not(#vbx):not(#vby) #checkoutPayment #orderTotalDivs > br.clearBoth{display:none !important}
html body:not(#vbx):not(#vby) #checkoutPayment tr#cartOrderTotals, html body:not(#vbx):not(#vby) #checkoutPayment td#orderTotalDivs{border-bottom:0 !important}
html body:not(#vbx):not(#vby) #checkoutPayment fieldset#comments > legend{font-family:inherit !important;font-size:12px !important;font-weight:600 !important;letter-spacing:.1em !important;text-transform:uppercase !important;color:#5F6672 !important;margin:0 0 6px !important}
/* 59. Checkout address edit form (Oct 30 2026, styling chat): flush with its heading, boxes fill their column (all 44 px), house buttons. */
html body:not(#vbx):not(#vby) #checkoutPayment [id^="address-form-"]{margin:4px 0 0 !important;padding:0 !important;width:100% !important;max-width:none !important;float:none !important}
html body:not(#vbx):not(#vby) #checkoutPayment [id^="address-form-"] .vb-af{margin:0 !important;padding:0 !important;width:100% !important;gap:12px 16px !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important}
html body:not(#vbx):not(#vby) #checkoutPayment [id^="address-form-"] .vb-af > [id^="choices-"]{grid-column:1 / -1}
html body:not(#vbx):not(#vby) #checkoutPayment [id^="address-form-"] .vb-af__f{margin:0 !important;padding:0 !important;width:auto !important;display:flex !important;flex-direction:column !important;gap:6px !important;position:relative}
html body:not(#vbx):not(#vby) #checkoutPayment [id^="address-form-"] .vb-af__f label, html body:not(#vbx):not(#vby) #checkoutPayment [id^="address-form-"] .vb-af__f .inputLabel{margin:0 !important;padding:0 !important;width:auto !important;float:none !important;font-size:12px !important;font-weight:600 !important;letter-spacing:.1em !important;text-transform:uppercase !important;color:#5F6672 !important}
html body:not(#vbx):not(#vby) #checkoutPayment [id^="address-form-"] input:not([type=checkbox]):not([type=radio]), html body:not(#vbx):not(#vby) #checkoutPayment [id^="address-form-"] select{width:100% !important;max-width:none !important;height:44px !important;min-height:44px !important;margin:0 !important;box-sizing:border-box !important;font-size:16px !important;float:none !important}
html body:not(#vbx):not(#vby) #checkoutPayment [id^="address-form-"] .vb-af__f span.alert{display:none !important}
html body:not(#vbx):not(#vby) #checkoutPayment [id^="opc-"][id$="-cancel"] .cssButton, html body:not(#vbx):not(#vby) #checkoutPayment [id^="opc-"][id$="-save"] .cssButton{display:inline-flex !important;align-items:center !important;justify-content:center !important;height:44px !important;min-height:44px !important;padding:0 22px !important;border-radius:8px !important;font-size:15px !important;font-weight:600 !important;letter-spacing:0 !important;text-transform:none !important;box-shadow:none !important;cursor:pointer}
html body:not(#vbx):not(#vby) #checkoutPayment [id^="opc-"][id$="-cancel"] .cssButton{background:transparent !important;border:1.5px solid #123560 !important;color:#123560 !important}
html body:not(#vbx):not(#vby) #checkoutPayment [id^="opc-"][id$="-save"] .cssButton{background:#123560 !important;border:0 !important;color:#F0F2F5 !important}
html body:not(#vbx):not(#vby) #checkoutPayment [id^="opc-"][id$="-cancel"], html body:not(#vbx):not(#vby) #checkoutPayment [id^="opc-"][id$="-save"]{margin:12px 0 0 12px !important}
html body:not(#vbx):not(#vby) #checkoutPayment [id^="address-form-"] [id^="choices-"]{margin:0 !important;padding:0 !important;width:100% !important;float:none !important}
html body:not(#vbx):not(#vby) #checkoutPayment [id^="address-form-"] [id^="choices-"] select{margin:0 !important}
html body:not(#vbx):not(#vby) #checkoutPayment #opc-bill-cancel, html body:not(#vbx):not(#vby) #checkoutPayment #opc-bill-save, html body:not(#vbx):not(#vby) #checkoutPayment #opc-ship-cancel, html body:not(#vbx):not(#vby) #checkoutPayment #opc-ship-save{float:none !important;margin:14px 12px 0 0 !important}
/* 60. Thank-you page order number as a small label (Oct 30 2026). */
html body:not(#vbx):not(#vby) #checkoutSuccessOrderNumber{font-size:12px !important;font-weight:600 !important;letter-spacing:.14em !important;text-transform:uppercase !important;color:#5F6672 !important;margin:14px 0 10px !important}
html body:not(#vbx):not(#vby) #checkoutSuccessOrderNumber strong{font-weight:600 !important}
/* 61. New addresses (Oct 30 2026): cart estimate note; checkout save-to-address-book box (vb_newaddr.js). */
html body:not(#vbx):not(#vby) .vb-cart-newaddr{margin:6px 0 4px !important;font-size:13px !important;color:#5F6672 !important}
html body:not(#vbx):not(#vby) #checkoutPayment [id^="opc-add-"] + label{font-size:15px !important;color:#15202E !important;text-transform:none !important;letter-spacing:0 !important;font-weight:400 !important}
html body:not(#vbx):not(#vby) #checkoutPayment #checkoutOneBillto .opc-buttons[style*="block"], html body:not(#vbx):not(#vby) #checkoutPayment #checkoutOneShipto .opc-buttons[style*="block"]{display:flex !important;flex-wrap:wrap !important;align-items:center !important;gap:12px !important;margin-top:14px !important;text-align:left !important}
html body:not(#vbx):not(#vby) #checkoutPayment .opc-buttons > .custom-checkbox{flex:0 0 100% !important;display:flex;align-items:center !important;gap:10px !important;margin:0 !important;padding:0 !important}
html body:not(#vbx):not(#vby) #checkoutPayment .opc-buttons > [id$="-cancel"], html body:not(#vbx):not(#vby) #checkoutPayment .opc-buttons > [id$="-save"]{margin:0 !important;float:none !important}
html body:not(#vbx):not(#vby) #checkoutPayment .opc-buttons > .opc-right{display:flex;flex-wrap:wrap !important;gap:12px !important;float:none !important;margin:0 !important;padding:0 !important;text-align:left !important}
html body:not(#vbx):not(#vby) #checkoutPayment .opc-buttons > .opc-right > span{margin:0 !important;float:none !important}
html body:not(#vbx):not(#vby) #checkoutPayment .button_confirm_order{font-size:15px !important;font-weight:600 !important;letter-spacing:0 !important}
/* 62. Address book (Oct 30 2026): primary address edit link; note when there are no other addresses. Template: tpl_address_book_default.php (village_bears). */
html body:not(#vbx):not(#vby) .vb-ab-primary-edit{clear:both;margin:10px 0 0;font-size:14px}
html body:not(#vbx):not(#vby) .vb-ab-primary-edit a{color:#123560 !important;text-decoration:underline;text-underline-offset:2px}
html body:not(#vbx):not(#vby) .vb-ab-none{font-size:15px;color:#5F6672;margin:8px 0 0}
html body#addressbookBody:not(#vbx):not(#vby) .centerColumn .cssButton.small_edit{display:inline-flex !important;align-items:center !important;justify-content:center !important;box-sizing:border-box !important;height:44px !important;min-height:44px !important;padding:0 22px !important;font-size:15px !important;font-weight:600 !important;letter-spacing:0 !important;text-transform:none !important;border:1.5px solid #123560 !important;border-radius:8px !important;background:transparent !important;color:#123560 !important;line-height:1 !important}
html body#addressbookBody:not(#vbx):not(#vby) .centerColumn .buttonRow.forward a + a{margin-left:10px}
html body#addressbookBody:not(#vbx):not(#vby) .centerColumn .cssButton{box-sizing:border-box !important;height:44px !important;min-height:44px !important}
html body#addressbookBody:not(#vbx):not(#vby) .centerColumn fieldset .buttonRow.forward{float:none !important;text-align:left !important;margin:12px 0 0 !important;display:flex !important;gap:10px !important}
html body#addressbookBody:not(#vbx):not(#vby) .centerColumn fieldset .buttonRow.forward a + a{margin-left:0}
html body#addressbookBody:not(#vbx):not(#vby) .centerColumn fieldset address{margin-bottom:0 !important}
/* 63. One button height site-wide (Oct 30 2026, Paul): every house button in page content is exactly 44 px, border included
   (most were 44 + border = 45.3 px; checkout address buttons were 44). Header/nav pills not touched. Smaller on purpose: checkout store-credit Apply (36 px). */
html body:not(#vbx):not(#vby) .centerColumn .cssButton, html body:not(#vbx):not(#vby) .centerColumn .vb-btn, html body:not(#vbx):not(#vby) .centerColumn button.cssButton, html body:not(#vbx):not(#vby) .centerColumn input.cssButton{box-sizing:border-box !important;height:44px !important;min-height:44px !important;max-height:44px}
html body:not(#vbx):not(#vby) .centerColumn .button_confirm_order{height:44px !important;min-height:44px !important}


/* ===== 64. Address book: smaller outline Edit / Delete buttons (Paul, Oct 30 2026, AEIIA rehearsal chat; 26 px slim version 10:55 pm) =====
   36 px (like checkout's store-credit Apply), both outline, Delete no longer solid navy. Covers Zen's hover class swap. */
body#addressbookBody:not(#vbx):not(#vby) #addressBookDefault fieldset .buttonRow { float: none !important; display: flex !important; gap: 6px; align-items: center; margin: 6px 0 20px !important; padding: 0 !important; }
body#addressbookBody:not(#vbx):not(#vby) #addressBookDefault fieldset .buttonRow a { text-decoration: none !important; }
body#addressbookBody:not(#vbx):not(#vby) #addressBookDefault fieldset .buttonRow a > span.cssButton,
body#addressbookBody:not(#vbx):not(#vby) #addressBookDefault fieldset .buttonRow a > span.cssButtonHover {
  display: inline-flex !important; align-items: center; justify-content: center; box-sizing: border-box !important;
  height: 26px !important; min-height: 26px !important; line-height: 1 !important; padding: 0 10px !important; margin: 0 !important; width: auto !important; min-width: 0 !important;
  background: transparent !important; color: #123560 !important; border: 1px solid #123560 !important; border-radius: 6px !important; box-shadow: none !important;
  font-size: 12px !important; font-weight: 500 !important; letter-spacing: normal !important; text-transform: none !important;
}
body#addressbookBody:not(#vbx):not(#vby) #addressBookDefault fieldset .buttonRow a > span.cssButtonHover { background: #123560 !important; color: #fff !important; }

/* ===== 65. Thank-you page + order details: Delivery and Billing side by side (Paul, Oct 30 2026, AEIIA rehearsal chat) ===== */
body#checkoutsuccessBody:not(#vbx):not(#vby) #accountHistInfo #myAccountShipInfo,
body#accounthistoryinfoBody:not(#vbx):not(#vby) #accountHistInfo #myAccountShipInfo,
body#checkoutsuccessBody:not(#vbx):not(#vby) #accountHistInfo #myAccountPaymentInfo,
body#accounthistoryinfoBody:not(#vbx):not(#vby) #accountHistInfo #myAccountPaymentInfo {
  float: left !important; clear: none !important; width: calc(50% - 16px) !important; box-sizing: border-box !important; margin: 0 0 16px 0 !important;
}
body#checkoutsuccessBody:not(#vbx):not(#vby) #accountHistInfo #myAccountPaymentInfo,
body#accounthistoryinfoBody:not(#vbx):not(#vby) #accountHistInfo #myAccountPaymentInfo { margin-left: 32px !important; }
@media (max-width: 600px) {
body#checkoutsuccessBody:not(#vbx):not(#vby) #accountHistInfo #myAccountShipInfo,
body#accounthistoryinfoBody:not(#vbx):not(#vby) #accountHistInfo #myAccountShipInfo,
body#checkoutsuccessBody:not(#vbx):not(#vby) #accountHistInfo #myAccountPaymentInfo,
body#accounthistoryinfoBody:not(#vbx):not(#vby) #accountHistInfo #myAccountPaymentInfo { float: none !important; width: 100% !important; margin-left: 0 !important; }
}

/* ===== 66. Thank-you page + order details: tighter spacing so the order fits on one screen (Paul, Oct 30 2026, AEIIA rehearsal chat) ===== */
body#checkoutsuccessBody:not(#vbx):not(#vby) #accountHistInfo,
body#accounthistoryinfoBody:not(#vbx):not(#vby) #accountHistInfo { margin-top: 12px !important; }
body#checkoutsuccessBody:not(#vbx):not(#vby) #orderHistoryStatus,
body#accounthistoryinfoBody:not(#vbx):not(#vby) #orderHistoryStatus { margin: 10px 0 6px !important; }
body#checkoutsuccessBody:not(#vbx):not(#vby) #myAccountOrdersStatus td, body#checkoutsuccessBody:not(#vbx):not(#vby) #orderHistoryHeading td,
body#accounthistoryinfoBody:not(#vbx):not(#vby) #myAccountOrdersStatus td, body#accounthistoryinfoBody:not(#vbx):not(#vby) #orderHistoryHeading td { padding-top: 6px !important; padding-bottom: 6px !important; }
body#checkoutsuccessBody:not(#vbx):not(#vby) #myAccountOrdersStatus td,
body#accounthistoryinfoBody:not(#vbx):not(#vby) #myAccountOrdersStatus td { line-height: 18px !important; font-size: 13px !important; }
body#checkoutsuccessBody:not(#vbx):not(#vby) #myAccountShipInfo, body#checkoutsuccessBody:not(#vbx):not(#vby) #myAccountPaymentInfo,
body#accounthistoryinfoBody:not(#vbx):not(#vby) #myAccountShipInfo, body#accounthistoryinfoBody:not(#vbx):not(#vby) #myAccountPaymentInfo { margin-top: 10px !important; margin-bottom: 4px !important; }
body#checkoutsuccessBody:not(#vbx):not(#vby) #myAccountShipInfo h3, body#checkoutsuccessBody:not(#vbx):not(#vby) #myAccountPaymentInfo h3,
body#accounthistoryinfoBody:not(#vbx):not(#vby) #myAccountShipInfo h3, body#accounthistoryinfoBody:not(#vbx):not(#vby) #myAccountPaymentInfo h3 { margin-bottom: 4px !important; }
body#checkoutsuccessBody:not(#vbx):not(#vby) #myAccountShipInfo address, body#checkoutsuccessBody:not(#vbx):not(#vby) #myAccountPaymentInfo address,
body#accounthistoryinfoBody:not(#vbx):not(#vby) #myAccountShipInfo address, body#accounthistoryinfoBody:not(#vbx):not(#vby) #myAccountPaymentInfo address { line-height: 20px !important; padding-bottom: 4px !important; }
body#checkoutsuccessBody:not(#vbx):not(#vby) #myAccountShipInfo h4, body#checkoutsuccessBody:not(#vbx):not(#vby) #myAccountPaymentInfo h4,
body#accounthistoryinfoBody:not(#vbx):not(#vby) #myAccountShipInfo h4, body#accounthistoryinfoBody:not(#vbx):not(#vby) #myAccountPaymentInfo h4 { margin: 8px 0 4px !important; }
body#checkoutsuccessBody:not(#vbx):not(#vby) #myAccountShipInfo > div, body#checkoutsuccessBody:not(#vbx):not(#vby) #myAccountPaymentInfo > div,
body#accounthistoryinfoBody:not(#vbx):not(#vby) #myAccountShipInfo > div, body#accounthistoryinfoBody:not(#vbx):not(#vby) #myAccountPaymentInfo > div { padding-bottom: 4px !important; }
body#checkoutsuccessBody:not(#vbx):not(#vby) #checkoutSuccessThanks { margin-top: 12px !important; }

/* ===== 67. Checkout card error: the box to fix gets a rose outline (same red as the message dot, --vbh-red) and a short note under it; jscript_vb_checkout_pay.js cardErr() adds/clears them (Paul, Oct 30 2026, AEIIA rehearsal chat) ===== */
html body:not(#vbx):not(#vby) #checkoutPayment .vb-ccfields .vb-cc-err, html body:not(#vbx):not(#vby) #checkoutPayment .vb-ccfields .vb-cc-err:focus, html body:not(#vbx):not(#vby) #checkoutPayment .vb-ccfields .vb-cc-err:hover {
  outline: 1.5px solid var(--vbh-red, #B3261E) !important; outline-offset: -1.5px !important; border-radius: 8px !important;
}
html body:not(#vbx):not(#vby) #checkoutPayment .vb-ccfields .vb-cc-note {
  display: block !important; width: 100% !important; flex: 0 0 100% !important; grid-column: 1 / -1 !important; box-sizing: border-box !important;
  margin: 6px 0 2px !important; padding: 0 !important; font-family: var(--vbh-sans) !important; font-size: 13px !important; line-height: 18px !important;
  font-weight: 400 !important; color: var(--vbh-red, #B3261E) !important; text-align: left !important;
}

/* ===== 68. No "Back" button at the end of the information pages (Shipping & returns, Privacy, Conditions, About us, page 2-4, Site map) (Paul, Oct 30 2026, AEIIA rehearsal chat) ===== */
body#shippinginfoBody:not(#vbx):not(#vby) #shippingInfo > .buttonRow.back,
body#privacyBody:not(#vbx):not(#vby) #privacy > .buttonRow.back,
body#conditionsBody:not(#vbx):not(#vby) #conditions > .buttonRow.back,
body#aboutusBody:not(#vbx):not(#vby) #aboutUs > .buttonRow.back,
body#page2Body:not(#vbx):not(#vby) #pageTwo > .buttonRow.back,
body#page3Body:not(#vbx):not(#vby) #pageThree > .buttonRow.back,
body#page4Body:not(#vbx):not(#vby) #pageFour > .buttonRow.back,
body#sitemapBody:not(#vbx):not(#vby) #siteMap > .buttonRow.back { display: none !important; }

/* ===== 69. Top menu: 'Bear artists' dropdown with North American + World Wide artists (Paul, Oct 31 2026, AEIIA chat) ===== */
body:not(#vbx):not(#vby) .vb-nav__dd { position: relative; display: inline-flex; align-items: center; }
body:not(#vbx):not(#vby) .vb-nav__caret { font-size: 10px; margin-left: 5px; opacity: .75; }
body:not(#vbx):not(#vby) .vb-nav__menu { display: none; position: absolute; top: 100%; left: -16px; z-index: 60; min-width: 230px; padding: 6px 0; background: #123560; border-radius: 0 0 8px 8px; box-shadow: 0 10px 24px rgba(11, 42, 80, .22); }
body:not(#vbx):not(#vby) .vb-nav__menu a { display: block !important; padding: 10px 16px !important; white-space: nowrap; font-size: 15px !important; }
body:not(#vbx):not(#vby) .vb-nav__menu a:hover, body:not(#vbx):not(#vby) .vb-nav__menu a:focus { background: rgba(255, 255, 255, .08); }
body:not(#vbx):not(#vby) .vb-nav__dd:hover .vb-nav__menu, body:not(#vbx):not(#vby) .vb-nav__dd:focus-within .vb-nav__menu, body:not(#vbx):not(#vby) .vb-nav__dd.is-open .vb-nav__menu { display: block; }
@media (max-width: 640px) {
  /* 69b. Phones: the top menu is a sideways scroller, which would hide a dropdown, so the two artist links sit in the row like the other links */
  html body:not(#vbx):not(#vby) #vbHeader .vb-nav__ddtop { display: none !important; }
  html body:not(#vbx):not(#vby) #vbHeader .vb-nav__dd { display: contents !important; }
  html body:not(#vbx):not(#vby) #vbHeader .vb-nav__menu { display: contents !important; }
  html body:not(#vbx):not(#vby) #vbHeader .vb-nav__menu a { padding: 0 !important; font-size: 14px !important; background: none !important; }
}