/* Monochrome optical controls. Images and numerical evidence remain the focus. */
[data-ultra-glass]{position:relative;isolation:isolate;overflow:visible}
.ultra-glass-canvas{position:absolute;left:-18px;top:-18px;width:calc(100% + 36px);height:calc(100% + 36px);pointer-events:none;z-index:0}
[data-ultra-glass]>button,[data-ultra-glass]>a{position:relative;z-index:1}
[data-glass-follow]>button,[data-glass-follow]>a{user-select:none;-webkit-user-select:none}
#project-content .ultra-glass-ready.glass-cta,#project-content .ultra-glass-ready .glass-cta,#case-explore .ultra-glass-ready .pour-button{background:transparent!important;border-color:transparent!important;box-shadow:none!important;backdrop-filter:none!important;transform:none!important;color:transparent!important;text-shadow:none!important}
[data-ultra-glass=selector].ultra-glass-ready button,[data-ultra-glass=selector].ultra-glass-ready button span{color:transparent!important;text-shadow:none!important;background:transparent!important;transform:none!important}
[data-ultra-glass=selector].ultra-glass-ready button:focus-visible{outline:1px solid #555!important;outline-offset:3px}
.dose-dial.ultra-glass-ready{background:transparent!important;border-color:transparent!important;box-shadow:none!important}
.dose-dial.ultra-glass-ready::before,.dose-dial.ultra-glass-ready::after{display:none!important}
.dose-dial.ultra-glass-ready output,.dose-dial.ultra-glass-ready output small{color:transparent!important;text-shadow:none!important}
.dose-dial .dial-pointer{z-index:2;pointer-events:none}
.ultra-action-set{width:100%;margin:0;position:relative;isolation:isolate}
.ultra-action-set .pour-button{min-height:54px;position:relative;z-index:1;justify-content:center;font-weight:500}
:is(.hero-bento,.hero-dispenser) .case-quick-actions{width:max-content;max-width:100%;gap:18px}
:is(.hero-bento,.hero-dispenser) .case-quick-actions .glass-cta{min-width:174px;padding:18px 26px!important;min-height:56px}
.case-section>.ultra-action-set{width:max-content;max-width:100%;margin-top:28px}
.ultra-glass-ready .glass-cta span{color:transparent!important}
.pour-readout{display:block;margin:6px 0 27px;text-align:center}
.pour-readout output{display:block;margin:0 0 20px;font-size:37px;font-weight:400;letter-spacing:-.05em}
.pour-readout output small{font-family:Geist;font-size:9px;margin-top:7px;color:#555;letter-spacing:.02em}
.dose-reservoir{position:relative;height:24px;width:100%;border-radius:20px;background:#eee;box-shadow:inset 0 1px 2px #8882;overflow:visible}
.dose-reservoir>i{display:block;width:0;height:100%;border-radius:20px;background:linear-gradient(#fff,#bbb);transition:width .1s linear}
.dose-reservoir.ultra-glass-ready>i{opacity:0}
.dose-reservoir .ultra-glass-canvas{z-index:1}
.dose-feedback{min-height:37px}
.metric-rail[data-ultra-glass] i{opacity:1;background:linear-gradient(180deg,#ffffff22,#ffffff88 45%,#d8d8d822)!important;border:.5px solid #b8b8b866;box-shadow:inset 0 1px 1px #ffffffcc}
.metric-rail[data-ultra-glass].ultra-glass-ready i{opacity:0}
.metric-rail[data-ultra-glass] i::after{display:none!important}
.metric-rail[data-ultra-glass] b{z-index:2!important;pointer-events:none}
.metric-rail .ultra-glass-canvas{z-index:1}
.gesture-motion{width:184px;flex:none;display:grid;gap:16px;padding:9px 0;transform-origin:center}
.gesture-axis{display:grid;grid-template-columns:64px 1fr;gap:10px;align-items:center}
.gesture-axis>span{font-family:Geist;font-size:8px;color:#555;line-height:1.3}
.gesture-axis>div{height:1px;position:relative;background:#dadada}
.gesture-axis i{position:absolute;left:var(--axis-position,50%);top:-4px;width:15px;height:9px;border-radius:7px;background:linear-gradient(150deg,#fff,#b8b8b8);border:.5px solid #aaa7;transform:translateX(-50%);transition:left .8s cubic-bezier(.2,.9,.2,1),width .5s}
.ice-flower[data-state=happy] .axis-0{--axis-position:50%}.ice-flower[data-state=happy] .axis-1{--axis-position:64%}.ice-flower[data-state=happy] .axis-2{--axis-position:59%}.ice-flower[data-state=happy] .axis-3{--axis-position:83%}
.ice-flower[data-state=relax] .axis-0{--axis-position:38%}.ice-flower[data-state=relax] .axis-1{--axis-position:53%}.ice-flower[data-state=relax] .axis-2{--axis-position:49%}.ice-flower[data-state=relax] .axis-3{--axis-position:59%}
.ice-flower[data-state=withdraw] .axis-0{--axis-position:47%}.ice-flower[data-state=withdraw] .axis-1{--axis-position:31%}.ice-flower[data-state=withdraw] .axis-2{--axis-position:25%}.ice-flower[data-state=withdraw] .axis-3{--axis-position:15%}
.ice-flower[data-state=excited] .gesture-axis i{animation:axis-sweep .8s ease-in-out 3}.ice-flower[data-state=excited] .axis-1 i{animation-delay:.09s}.ice-flower[data-state=excited] .axis-2 i{animation-delay:.15s}.ice-flower[data-state=excited] .axis-3 i{animation-delay:.2s}
.gesture-model{min-height:155px;gap:22px}
.gesture-model .eyebrow{font-size:8px!important}
@keyframes axis-sweep{0%,100%{left:45%;width:15px}50%{left:80%;width:20px}}
@media(max-width:600px){:is(.hero-bento,.hero-dispenser) .case-quick-actions{gap:12px;width:100%}:is(.hero-bento,.hero-dispenser) .case-quick-actions .glass-cta{min-width:0;flex:1;padding:17px 16px!important;min-height:53px;font-size:13px!important}.gesture-motion{width:154px}.gesture-axis{grid-template-columns:58px 1fr;gap:8px}.gesture-model{gap:14px;min-height:145px}.dose-reservoir{height:23px}.pour-readout output{font-size:36px}.ultra-action-set .pour-button{min-height:54px}}
@media(prefers-reduced-motion:reduce){.gesture-axis i{animation:none!important;transition:none!important}}
/* Foreground type remains sharp; the optical material behind it is transparent. */
#project-content .ultra-glass-ready .glass-cta,#case-explore .ultra-glass-ready .pour-button,[data-ultra-glass=selector].ultra-glass-ready button{color:#111!important}
[data-ultra-glass=selector].ultra-glass-ready button span{color:#666!important}
.dose-dial.ultra-glass-ready output{color:#111!important;position:relative;z-index:2}
.dose-dial.ultra-glass-ready output small{color:#666!important}
.dose-reservoir{background:transparent;border:.5px solid #d0d0d0;box-shadow:inset 0 1px 2px #8881}
.blade-study .metric-rail[data-ultra-glass]{background:transparent;border-color:#d3d3d370}

/* Four individual transparent lenses share one liquid surface. */
.flower-state-buttons.ultra-glass-ready button{transform:none!important;color:#111!important;touch-action:manipulation}
.flower-state-buttons button[aria-pressed=true] span{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
