/* Live-only tree details use the clearing's existing glass palette. */
.tree-progress-halo{position:absolute;left:50%;bottom:0;width:100%;height:auto;transform:translateX(-50%);pointer-events:none;filter:brightness(0) invert(1) blur(4px) drop-shadow(0 0 8px #d4efff);opacity:0;transition:opacity .3s ease;z-index:0}
#tree[data-stage="0"] .tree-progress-halo{width:176.4%;bottom:5%}
#tree:has(.tree-progress-trigger:not([hidden]):hover) .tree-progress-halo,
#tree:has(.tree-progress-trigger:focus-visible) .tree-progress-halo,
#tree:has(.tree-progress-trigger[aria-expanded="true"]) .tree-progress-halo{opacity:.68}
.tree-progress-trigger{position:absolute;inset:0;z-index:8;width:100%;height:100%;padding:0;border:0;background:none;cursor:pointer;clip-path:polygon(40% 0,60% 0,100% 87%,100% 100%,0 100%,0 87%);-webkit-tap-highlight-color:transparent}
.tree-progress-trigger[hidden],#tree-progress-panel[hidden]{display:none}
.tree-progress-trigger span{position:absolute;bottom:0;left:calc(50% + 10px);display:grid;place-items:center;width:19px;height:19px;border:1px solid #deefffa6;border-radius:50%;background:var(--elka-control-surface);box-shadow:0 0 8px #c5e8ff80,inset 0 0 5px #e2efff70;color:#f2fbff;font:700 12px/1 Georgia,serif;opacity:0;transition:opacity .2s,box-shadow .2s}
.tree-progress-trigger:hover span,.tree-progress-trigger:focus-visible span{opacity:1;box-shadow:var(--elka-control-hover)}
.tree-progress-trigger:focus-visible{outline:none}
.tree-progress-trigger:focus-visible span{outline:2px solid white;outline-offset:3px}
#tree-progress-panel{position:absolute;z-index:21;box-sizing:border-box;padding:10px 13px 11px;border:1px solid #deefffa6;border-radius:18px;background:var(--elka-glass-surface);box-shadow:var(--elka-glass-rim);backdrop-filter:blur(20px) saturate(1.2);-webkit-backdrop-filter:blur(20px) saturate(1.2);color:#f7fbff;transform-origin:50% 100%;text-shadow:0 1px 3px #18305866}
.tree-progress-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.tree-progress-heading strong{font:650 13px/1.3 system-ui}
.tree-progress-stage{margin-left:5px;color:#e0edff;font-weight:500}
.tree-progress-heading button{display:grid;place-items:center;width:20px;height:20px;flex-shrink:0;padding:0;border:1px solid #e1edff80;border-radius:50%;background:var(--elka-control-surface);box-shadow:inset 0 0 5px #e6f3ff66,0 0 6px #d6edff40;color:white;cursor:pointer}
.tree-progress-heading svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
.tree-progress-heading button:hover{box-shadow:var(--elka-control-hover)}
.tree-progress-heading button:focus-visible{outline:2px solid #f0ffff;outline-offset:3px}
.tree-progress-steps{display:grid;grid-template-columns:repeat(5,1fr);align-items:center;list-style:none;margin:9px 0 8px;padding:0}
.tree-progress-steps li{position:relative;display:grid;place-items:center;height:14px}
.tree-progress-steps li:not(:last-child)::after{content:"";position:absolute;top:50%;left:calc(50% + 10px);width:calc(100% - 20px);height:1px;background:linear-gradient(90deg,#d7edff08,#d7edff55 50%,#d7edff08);box-shadow:0 1px 1px #21406512}
.tree-progress-steps span{position:relative;display:block;width:11px;height:11px;border:1px solid #e1f1ff70;border-radius:50%;background:radial-gradient(ellipse at 32% 22%,#f7ffff99,transparent 65%),var(--elka-soft-cell);box-shadow:inset 0 -2px 3px #6e8daf33,inset 0 0 3px #effaff55,0 1px 3px #243b5822}
.tree-progress-steps span::before{content:"";position:absolute;inset:1px 2px 5px 1px;border-radius:50%;background:linear-gradient(150deg,#ffffff70,#ffffff00);filter:blur(.45px)}
.tree-progress-steps [data-state="passed"] span{border-color:#b7edcc88;background:var(--elka-positive-surface);box-shadow:inset 0 1px 3px #dbffe366,inset 0 -2px 3px #125c4e33,0 0 5px #a5f0c455,0 0 9px #66cb9b33}
.tree-progress-steps [data-state="current"] span{border-color:#f7c4d288;background:var(--elka-negative-surface);box-shadow:inset 0 1px 3px #ffe4ec66,inset 0 -2px 3px #76294333,0 0 5px #f4a9bf44}
.tree-progress-steps [data-state="current"] span::after{content:"";position:absolute;inset:-4px;border-radius:50%;background:radial-gradient(circle,#f1a6bd55,transparent 72%);filter:blur(2px);opacity:.6;pointer-events:none}
#tree-progress-panel:not([hidden]) .tree-progress-steps [data-state="current"] span{animation:treeProgressLamp 3.6s ease-in-out infinite}
#tree-progress-panel:not([hidden]) .tree-progress-steps [data-state="current"] span::after{animation:treeProgressLampAura 3.6s ease-in-out infinite}
@keyframes treeProgressLamp{0%,100%{filter:brightness(.78)}45%,60%{filter:brightness(1.08)}}
@keyframes treeProgressLampAura{0%,100%{opacity:.12}45%,60%{opacity:.85}}
#tree-progress-panel.is-complete:not([hidden]) .tree-progress-steps li:last-child[data-state="passed"] span{animation:treeProgressFinalLamp 2.2s ease-in-out infinite}
@keyframes treeProgressFinalLamp{0%,100%{filter:brightness(.82);box-shadow:inset 0 1px 3px #dbffe366,inset 0 -2px 3px #125c4e33,0 0 4px #a5f0c444,0 0 8px #66cb9b2b}50%{filter:brightness(1.18);box-shadow:inset 0 1px 3px #effff3aa,inset 0 -2px 3px #125c4e33,0 0 7px #baffcfaa,0 0 14px #66e6a377}}

@media(prefers-reduced-motion:reduce){#tree-progress-panel .tree-progress-steps [data-state="current"] span,#tree-progress-panel .tree-progress-steps [data-state="current"] span::after,#tree-progress-panel.is-complete .tree-progress-steps li:last-child[data-state="passed"] span{animation:none}}
.tree-progress-copy{margin:0;text-align:left;color:#e6f1ff;font:500 12px/1.35 system-ui;text-wrap:pretty}
.tree-progress-copy strong{color:white;font-weight:750}
@media(prefers-reduced-motion:reduce){.tree-progress-halo,.tree-progress-trigger span{transition:none}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){#tree-progress-panel{background:linear-gradient(135deg,#8096c9f5,#526ba3f5)}}

/* In live mode ornaments should not intercept a click on the tree behind them. */
body:not(.editing):has(.tree-progress-trigger:not([hidden])) #decor-layer .placed-decor{pointer-events:none}
