/* Oak (wine). Everything scoped under .oak-*. */
.oak-sc { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.oak-sc > svg { display: block; width: 100%; max-width: 340px; height: auto; overflow: visible; }
.oak-lb { fill: var(--dim); font: 700 14px var(--sans); text-anchor: middle; }
.oak-lb.sm { font-size: 12.5px; font-weight: 600; fill: var(--faint); }
.oak-lb.st { text-anchor: start; }

/* toast */
.oak-stave { fill: #d9b88a; stroke: #7a5a3a; stroke-width: 1.5; }
.oak-cav { fill: #14111e; }
.oak-arr { stroke: var(--dim); stroke-width: 1.5; }
.oak-face { fill: none; stroke: #d9b88a; stroke-width: 11; stroke-linecap: round; transition: stroke .6s; }
.oak-hoop { stroke: #4a4458; stroke-width: 5; }
.oak-lvl { fill: var(--gold); font-size: 16px; }
.oak-tl { fill: var(--dim); }
.oak-basket { fill: #2a2438; stroke: var(--line-strong); stroke-width: 1.5; }
.oak-fl { transform-box: fill-box; transform-origin: 50% 100%; transition: transform .3s; }
.oak-fl.f1 { fill: #FCC050; } .oak-fl.f2 { fill: #ff7a3c; }
.oak-toast .oak-fl { transform: scaleY(.55); }
.oak-toast.burn .oak-fl { transform: scaleY(1.25); }
.oak-hit { fill: transparent; cursor: pointer; }
.oak-trk { fill: rgba(255,255,255,.07); }
.oak-bar { transition: width .6s cubic-bezier(.34,1.2,.64,1); }

/* fill */
.oak-ring { fill: none; stroke: #caa272; stroke-width: 14; }
.oak-toastring { fill: none; stroke: #6a3c1e; stroke-width: 6; transition: opacity .6s; }
.oak-wine { fill: #7a1732; }
.oak-mol { stroke: rgba(0,0,0,.35); stroke-width: .8; }
.oak-mol.v { fill: #FCC050; } .oak-mol.c { fill: #f4efe2; }
.oak-btl { opacity: .25; transition: opacity .4s; }
.oak-btl.in { opacity: 1; }
.oak-btl path { fill: #3a0c1c; stroke: var(--line-strong); stroke-width: 1.2; }
.oak-btrk { fill: rgba(255,255,255,.07); }
.oak-bfill { fill: var(--gold); transition: width .6s; }

/* chips */
.oak-tw { fill: #c9b44a; opacity: .85; }
.oak-rope { stroke: #9a8a70; stroke-width: 2; }
.oak-mesh { fill: rgba(255,255,255,.12); stroke: #d8d0c0; stroke-width: 1.5; stroke-dasharray: 3 2; }
.oak-chip { fill: #6a3c1e; }

@media (max-height: 700px) {
  .oak-sc > svg { max-height: 250px; }
}