/* ======================================================================
   Shared component: the nicotine ruler, lanes, readout and specimen shelf
   Used with js/nicotine-ruler.js (window.NicotineRuler.init)
   ====================================================================== */
.nr-sec{background:var(--cream-100);padding:84px 0 76px}
.nr-sec,.nr{--brass1:#e6c97c;--brass2:#c9a24a;--brass3:#a37b2e;--ink-br:#3a2509}
.nr-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:16px 56px;align-items:end;margin-bottom:34px}
.nr-head h2{margin:0;font-size:clamp(34px,4.4vw,54px);color:var(--brown-900)}
.nr-sec .eyebrow{color:var(--gold-700)}
.nr-intro p{margin:0 0 10px;color:var(--ink-600);font-size:17px;line-height:1.6}
.nr-links{margin:0}.nr-links a{font-weight:600;color:var(--brown-700)}
.nr{position:relative;border-radius:14px;background:radial-gradient(120% 100% at 50% 0,#43291a 0,#2c1b0f 55%,#20140a 100%);color:var(--cream-100);padding:34px 30px 30px;box-shadow:0 18px 40px -22px rgba(30,20,10,.6),inset 0 0 0 1px rgba(217,180,91,.28),inset 0 1px 0 rgba(255,236,190,.1)}
/* ruler */
.nr-ruler{padding:0 22px;cursor:pointer;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.nr-plane{position:relative}
.nr-strip{position:relative;height:64px;margin:0 -22px;border-radius:5px;background:linear-gradient(180deg,var(--brass1) 0,var(--brass2) 36%,var(--brass3) 64%,#c4a04f 100%);box-shadow:inset 0 1px 0 rgba(255,246,214,.7),inset 0 -1px 0 rgba(60,38,8,.55),0 6px 12px -6px rgba(0,0,0,.7)}
.nr-in{position:absolute;left:22px;right:22px;top:0;bottom:0}
.nr-ticks i{position:absolute;top:0;width:1px;margin-left:-.5px;background:var(--ink-br);height:10px;opacity:.85}
.nr-ticks i.h{height:17px}.nr-ticks i.w{height:26px;width:1.5px;opacity:1}
.nr-labs b{position:absolute;top:30px;transform:translateX(-50%);font:600 15px/1 var(--font-head);color:var(--ink-br);text-shadow:0 1px 0 rgba(255,238,196,.6);letter-spacing:.02em}
.nr-labs b.lh{font-size:12.5px;font-weight:500;opacity:.8}
.nr-unit{position:absolute;right:26px;bottom:6px;font:600 9px var(--font-body);letter-spacing:.2em;text-transform:uppercase;color:rgba(58,37,9,.0)}
.nr-lanes{position:relative;padding-top:12px;padding-bottom:6px}
.nr-lane{position:relative;height:20px;margin-top:2px}
.nr-lane .nb{position:absolute;left:var(--a);width:var(--w);top:8px;height:5px;border-radius:3px;background:var(--gold-300);opacity:.55;transition:opacity .4s ease,background-color .4s ease}
.nr-lane.dash .nb{background:none;border-top:1.5px dashed var(--gold-300);height:0;top:10px;border-radius:0}
.nr-lane .ln{position:absolute;top:2px;font:600 11px/16px var(--font-body);letter-spacing:.12em;text-transform:uppercase;color:#cdbf9f;white-space:nowrap;text-shadow:0 0 5px #2a1a0e,0 0 3px #2a1a0e,0 0 2px #2a1a0e;transition:color .4s ease,opacity .4s ease;opacity:.75}
.nr-lane .ln.r{left:calc(var(--a) + var(--w) + 10px)}
.nr-lane .ln.l{right:calc(100% - var(--a) + 10px)}
.nr-lane.on .nb{opacity:1;background:#f0d58e}.nr-lane.dash.on .nb{border-top-color:#f0d58e}
.nr-lane.on .ln{color:#f6e7bd;opacity:1}
.nr-guj{margin-top:8px}
.nr-guj .nb{height:9px;top:5px;background:none;border:1px solid var(--gold-300);border-top:0;border-radius:0 0 3px 3px;opacity:.7}
.nr-guj .ln{color:var(--gold-300);opacity:.85;font-size:10.5px}
.nr-handle{position:absolute;top:-10px;bottom:0;left:0;width:44px;margin-left:-22px;cursor:grab;z-index:3;touch-action:none;outline:none;display:flex;flex-direction:column;align-items:center}
.nr-handle[hidden]{display:none}
.nr-handle:active{cursor:grabbing}
.nr-knob{display:block;width:44px;height:26px;border-radius:5px 5px 14px 14px/5px 5px 12px 12px;background:linear-gradient(180deg,#5b3a1c,#3a2410);border:1px solid var(--gold-300);box-shadow:0 4px 8px -2px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,236,190,.28);text-align:center;transition:border-color .3s}
.nr-knob b{display:block;font:600 16px/24px var(--font-head);color:var(--gold-300);letter-spacing:.03em}
.nr-hair{display:block;flex:1;width:1.5px;background:linear-gradient(180deg,var(--gold-300),rgba(217,180,91,.55));margin-top:-1px;box-shadow:0 0 0 .5px rgba(30,20,10,.5)}
.nr-handle:focus-visible .nr-knob{outline:3px solid var(--gold-300);outline-offset:3px;border-color:#fff3cf}
.nr-handle:focus-visible{outline:none}
/* readout */
.nr-read{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 30px;align-items:center;margin-top:22px;padding:18px 24px;border-radius:10px;background:rgba(14,8,3,.38);box-shadow:inset 0 2px 8px rgba(0,0,0,.45),inset 0 0 0 1px rgba(217,180,91,.18)}
.nr-num{margin:0;font:600 64px/1 var(--font-head);color:var(--gold-300);min-width:2.55em;white-space:nowrap}
.nr-num i{font-style:normal;font-size:.5em;margin-left:3px;color:#cdbf9f}
.nr-say p{margin:0}
#nr-say,.nr-say .nr-say-t{font:500 19px/1.5 var(--font-body);color:var(--cream-100);max-width:none;min-height:3em}
.nr-cta{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;margin-top:12px!important}
.nr-cta a{font:600 14.5px var(--font-body);text-decoration:none;min-height:44px;display:inline-flex;align-items:center;padding:0 20px;border-radius:4px;transition:background-color .3s,color .3s,border-color .3s}
.nr-b1{background:var(--gold-300);color:var(--charcoal-900)}.nr-b1:hover{background:#f0d58e;color:var(--charcoal-900)}
.nr-b2{border:1.5px solid rgba(217,180,91,.7);color:var(--cream-100)}.nr-b2:hover{background:rgba(217,180,91,.14);color:#fff}
.nr-b3{color:var(--gold-300);padding:0 4px!important;text-decoration:underline!important;text-underline-offset:4px}.nr-b3:hover{color:#f0d58e}
.nr-cta a:focus-visible{outline:3px solid var(--gold-300);outline-offset:3px}
/* shelf */
.nr-shelf{margin-top:24px;padding:26px 18px 0;border-radius:10px;background:linear-gradient(180deg,rgba(10,6,2,.55),rgba(36,23,12,.2) 70%);box-shadow:inset 0 10px 18px -8px rgba(0,0,0,.65),inset 0 -1px 0 rgba(217,180,91,.25);border-bottom:0}
.nr-specs{list-style:none;margin:0;padding:0 0 18px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;align-items:start}
.spec{margin:0;position:relative;transition:transform .45s ease,opacity .45s ease,filter .45s ease}
.spec-jar{position:relative;margin:0;aspect-ratio:3/4;border-radius:96px 96px 12px 12px/74px 74px 12px 12px;overflow:hidden;background:#150d06;box-shadow:0 14px 16px -10px rgba(0,0,0,.8),inset 0 0 0 1px rgba(217,180,91,.4)}
.spec-jar img{width:100%;height:100%;object-fit:cover;display:block;transition:filter .45s ease,transform .6s ease}
.spec-jar::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 5px rgba(20,12,5,.55),inset 0 0 18px 4px rgba(0,0,0,.55),inset 0 0 0 6px rgba(217,180,91,.3);pointer-events:none}
.spec-loupe{position:absolute;right:9px;bottom:9px;width:58px;height:58px;border-radius:50%;overflow:hidden;z-index:2;box-shadow:0 0 0 2px var(--gold-300),0 0 0 3px rgba(30,20,10,.7),0 6px 10px -2px rgba(0,0,0,.7)}
.spec-loupe img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.5)}
.spec-plate{position:relative;margin:12px 6px 0;padding:9px 8px 10px;text-align:center;border-radius:3px;background:linear-gradient(180deg,#46301b,#34220f);box-shadow:inset 0 0 0 1px rgba(217,180,91,.6),inset 0 0 0 4px rgba(20,12,5,.55),inset 0 0 0 5px rgba(217,180,91,.25),0 5px 8px -4px rgba(0,0,0,.7);transition:box-shadow .4s ease}
.spec-plate p{margin:0}
.sp-e{font:600 9.5px/1.3 var(--font-body);letter-spacing:.2em;text-transform:uppercase;color:#cdbf9f}
.spec-plate h3{margin:2px 0 2px;font:600 24px/1.1 var(--font-head);color:var(--cream-100);letter-spacing:.02em}
.sp-b{font:600 14px/1.3 var(--font-body);color:var(--gold-300);font-variant-numeric:tabular-nums}
.sp-f{font:400 12px/1.35 var(--font-body);color:#cdbf9f;margin-top:2px!important}
.nr.live .spec.off{opacity:.42}
.nr.live .spec.on{transform:translateY(-10px)}
.nr.live .spec.on .spec-jar{box-shadow:0 22px 20px -12px rgba(0,0,0,.85),inset 0 0 0 1px rgba(240,213,142,.9)}
.nr.live .spec.on .spec-jar img{filter:brightness(1.12) saturate(1.08)}
.nr.live .spec.on .spec-plate{box-shadow:inset 0 0 0 1px #f0d58e,inset 0 0 0 4px rgba(20,12,5,.55),inset 0 0 0 5px rgba(240,213,142,.5),0 5px 8px -4px rgba(0,0,0,.7)}
/* table */
.nr-data{margin-top:26px;color:var(--ink-600)}
.nr-data summary{cursor:pointer;font:600 14.5px var(--font-body);color:var(--brown-700);min-height:44px;display:flex;align-items:center}
.nr-data table{width:100%;border-collapse:collapse;font-size:15px;margin-top:6px}
.nr-data caption{text-align:left;font:600 12px var(--font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-700);padding-bottom:8px}
.nr-data th,.nr-data td{text-align:left;padding:9px 12px 9px 0;border-top:1px solid var(--hair);font-weight:400;vertical-align:top}
.nr-data th{font-weight:600;color:var(--brown-900)}.nr-data thead th{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-700);border-top:0}
.nr-fn{margin:14px 0 0;font-size:14px;color:var(--ink-600)}
@media (max-width:1100px){.nr-specs{gap:12px}.spec-plate h3{font-size:21px}.sp-b{font-size:13px}.spec-loupe{width:46px;height:46px}}
@media (max-width:900px){
.nr-head{grid-template-columns:1fr;margin-bottom:26px}
.nr-sec{padding:60px 0 56px}
.nr{padding:26px 16px 22px}
.nr-ruler{padding:0 18px}.nr-strip{margin:0 -18px}.nr-in{left:18px;right:18px}
.nr-labs b.lh{display:none}
.nr-read{grid-template-columns:1fr;padding:16px 18px}.nr-num{font-size:48px}
#nr-say,.nr-say .nr-say-t{font-size:17px}
.nr-shelf{margin:22px -16px 0;border-radius:0;padding:24px 0 0}
.nr-specs{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;padding:12px 24px 22px;scroll-padding-left:24px;-webkit-overflow-scrolling:touch}
.spec{flex:0 0 min(58vw,230px);scroll-snap-align:start}
.spec-loupe{width:54px;height:54px}.spec-plate h3{font-size:24px}.sp-b{font-size:14px}
}
@media (max-width:640px){
.nr-handle{width:56px;margin-left:-28px}.nr-knob{width:52px;height:32px}.nr-knob b{line-height:30px;font-size:18px}
.nr-ruler{padding:0 20px}.nr-strip{margin:0 -20px}.nr-in{left:20px;right:20px}
.nr-lane .ln{font-size:10px;letter-spacing:.08em}
.nr-cta a{flex:1 1 100%;justify-content:center}.nr-b3{flex:0 0 auto!important}
}
@media (prefers-reduced-motion:reduce){.spec,.spec-jar img,.nr-lane .nb,.nr-lane .ln,.nr-knob,.spec-plate{transition:none!important}}
