/* Kolumny i próbki drewna (tekstury) */
[hidden]{display:none !important}
.w-bklejony{--st:url(../media/st_bklejony.jpg);--sw:url(../media/sw_bklejony.jpg);--tp:url(../media/tp_bklejony.png);--bt:url(../media/bt_bklejony.png)}
.w-bprasowany{--st:url(../media/st_bprasowany.jpg);--sw:url(../media/sw_bprasowany.jpg);--tp:url(../media/tp_bprasowany.png);--bt:url(../media/bt_bprasowany.png)}
.w-tiger{--st:url(../media/st_tiger.jpg);--sw:url(../media/sw_tiger.jpg);--tp:url(../media/tp_tiger.png);--bt:url(../media/bt_tiger.png)}
.w-padouk{--st:url(../media/st_padouk.jpg);--sw:url(../media/sw_padouk.jpg);--tp:url(../media/tp_padouk.png);--bt:url(../media/bt_padouk.png)}
.w-dab{--st:url(../media/st_dab.jpg);--sw:url(../media/sw_dab.jpg);--tp:url(../media/tp_dab.png);--bt:url(../media/bt_dab.png)}
.w-orzech{--st:url(../media/st_orzech.jpg);--sw:url(../media/sw_orzech.jpg);--tp:url(../media/tp_orzech.png);--bt:url(../media/bt_orzech.png)}
.w-mahon{--st:url(../media/st_mahon.jpg);--sw:url(../media/sw_mahon.jpg);--tp:url(../media/tp_mahon.png);--bt:url(../media/bt_mahon.png)}
.w-tosika,.w-osika{--st:url(../media/st_tosika.jpg);--sw:url(../media/sw_tosika.jpg);--tp:url(../media/tp_tosika.png);--bt:url(../media/bt_tosika.png)}
.w-tolcha,.w-olcha{--st:url(../media/st_tolcha.jpg);--sw:url(../media/sw_tolcha.jpg);--tp:url(../media/tp_tolcha.png);--bt:url(../media/bt_tolcha.png)}
.w-tabachi,.w-abachi{--st:url(../media/st_tabachi.jpg);--sw:url(../media/sw_tabachi.jpg);--tp:url(../media/tp_tabachi.png);--bt:url(../media/bt_tabachi.png)}
.col{--cw:84px;--ch:560px;position:relative;display:flex;flex-direction:column;width:var(--cw);height:var(--ch)}
.col-anim{transition:height .35s ease}
.col-top{flex:none;aspect-ratio:240 / 53;background:var(--tp) center / 100% 100% no-repeat}
.col-mid{position:relative;flex:1 1 auto;min-height:0;background:var(--st) center top / 100% auto repeat-y;overflow:hidden}
.col-bot{flex:none;aspect-ratio:240 / 27;background:var(--bt) center / 100% 100% no-repeat}
.col-logo{position:absolute;left:50%;bottom:7%;width:42%;transform:translateX(-50%) rotate(-90deg);mix-blend-mode:multiply;opacity:.72;pointer-events:none;user-select:none;-webkit-user-drag:none}
.col.flipped .col-logo{bottom:auto;top:7%;transform:translateX(-50%) rotate(90deg)}
.col-jack{position:absolute;left:50%;top:36%;width:24%;aspect-ratio:1;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle at 42% 38%,#2a2d2f 0 22%,#c9cdd0 24% 44%,#f2f3f1 46% 52%,#8b9094 56% 78%,#5d6266 80% 100%);box-shadow:0 1px 2px rgba(0,0,0,.55),inset 0 0 0 1px rgba(0,0,0,.25)}
.col-cast{filter:drop-shadow(10px 16px 14px rgba(18,28,26,.28))}
.col-rot{transform-origin:50% 50%;will-change:transform}
.col-rot.settle{transition:transform .6s cubic-bezier(.25,.8,.3,1)}
.col-grip{position:absolute;left:-22px;right:-22px;height:26%;cursor:grab;touch-action:none;z-index:2;border-radius:32px;transition:background .2s}
.col-grip-a{top:-22px}
.col-grip-b{bottom:-22px}
.col-grip:hover{background:radial-gradient(closest-side,rgba(255,255,255,.28),rgba(255,255,255,0))}
.col-floor{width:180px;height:18px;margin-top:-6px;border-radius:50%;background:radial-gradient(closest-side,rgba(18,28,26,.34),rgba(18,28,26,0));transition:opacity .3s}
.swatch{background:var(--sw) center / cover}
@media (prefers-reduced-motion: reduce){.col-rot.settle,.col-anim,.col-grip{transition:none}}
.col-spin{will-change:transform}
.col-hint{position:absolute;top:8px;right:0;z-index:3;margin:0;display:flex;align-items:center;gap:8px;font-size:15px;color:#4A5753;transition:opacity .4s}