*{box-sizing:border-box}
.cloudie-wheel-stage{--ring-scale:1;--preview-fit:1;position:absolute;left:50%;top:50%;width:640px;height:640px;transform:translate(-50%,-50%) scale(var(--preview-fit));transform-origin:center;font-family:"Segoe UI","Microsoft YaHei UI",sans-serif;color:#314d60}
.cloudie-wheel-layer{position:absolute;z-index:2;inset:0;opacity:0;transform:scale(var(--ring-scale));transform-origin:center;pointer-events:none;transition:opacity 140ms ease-out}
.cloudie-wheel-expanded .cloudie-wheel-layer{opacity:1;pointer-events:auto}
.cloudie-wheel-sector-svg{position:absolute;inset:20px;width:600px;height:600px;overflow:visible;filter:drop-shadow(0 8px 10px #284a6026)}
.cloudie-wheel-sector{fill:rgba(245,250,253,.96);stroke:#ffffff;stroke-width:1;vector-effect:non-scaling-stroke;pointer-events:auto;cursor:pointer;transition:fill 120ms ease,stroke 120ms ease}
.cloudie-wheel-sector.active{fill:#bad8e8;stroke:#749fb8}
.cloudie-wheel-tools{position:absolute;inset:0;pointer-events:none}
.cloudie-wheel-tool{--angle:0deg;--radius:225px;position:absolute;left:275px;top:283px;width:90px;height:74px;display:grid;place-items:center;align-content:center;gap:7px;padding:5px 2px;border:0;color:#314d60;background:transparent;transform:rotate(var(--angle)) translateY(calc(-1 * var(--radius))) rotate(calc(-1 * var(--angle)));transform-origin:45px 37px;cursor:pointer;pointer-events:auto;transition:color 120ms ease}
.cloudie-wheel-tool:hover,.cloudie-wheel-tool:focus-visible,.cloudie-wheel-tool.active{color:#163f5b;outline:none}
.cloudie-wheel-tool:focus-visible{outline:2px solid #557f98;border-radius:10px;outline-offset:-3px}
.cloudie-wheel-icon{fill:currentColor;stroke:none;width:27px;height:27px;display:block;overflow:visible;color:currentColor;transition:transform 120ms ease}
.cloudie-wheel-tool.active .cloudie-wheel-icon,.cloudie-wheel-tool:hover .cloudie-wheel-icon{transform:translateY(-2px)}
.cloudie-wheel-tool span{max-width:88px;font:600 14px/19px "Segoe UI","Microsoft YaHei UI",sans-serif;text-align:center;white-space:nowrap}
.cloudie-wheel-reopen{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);padding:12px 20px;border:1px solid #fff;border-radius:14px;background:#eaf3f9;color:#31556d;font:500 14px "Segoe UI","Microsoft YaHei UI",sans-serif;cursor:pointer}
.cloudie-wheel-reopen[hidden]{display:none}

.cloudie-wheel-standalone-preview{background:radial-gradient(ellipse at 22% 18%,#edf3f6 0,transparent 60%),linear-gradient(140deg,#dbe6ec,#bdcdd8)}

/* Glass lighting is isolated from the readable content above it. */
.cloudie-wheel-tool{color:#24475e}.cloudie-wheel-tool span{font-weight:600;text-shadow:0 1px 0 #ffffff8c}.cloudie-wheel-tool:hover,.cloudie-wheel-tool.active{color:#123d5a}
.cloudie-wheel-sector{fill:rgba(240,248,253,.97);stroke:#ffffffed}.cloudie-wheel-sector.active{fill:#b5d8eb;stroke:#75a9c8}

/* Blue-violet glass surfaces; quiet aqua is reserved for status. */
.cloudie-wheel-sector{fill:#f4f6fff7;stroke:#fffffff0}.cloudie-wheel-sector.active{fill:#e0d8f4;stroke:#b3a3db}.cloudie-wheel-tool{color:#3c4d71}.cloudie-wheel-icon{color:#657abe}.cloudie-wheel-tool.active,.cloudie-wheel-tool:hover,.cloudie-wheel-tool.active .cloudie-wheel-icon{color:#6a539c}
.cloudie-wheel-standalone-preview{background:radial-gradient(ellipse at 12% 18%,#dbe5fd 0,transparent 60%),radial-gradient(ellipse at 92% 86%,#ded6ef 0,transparent 60%),#edf0f8}

/* Optical center: light moves around the rim; text stays still and opaque. */
.cloudie-wheel-center{position:absolute;z-index:4;left:218px;top:218px;width:204px;height:204px;border-radius:50%;isolation:isolate;opacity:0;visibility:hidden;pointer-events:none;transition:opacity 150ms ease}
.cloudie-wheel-expanded .cloudie-wheel-center{opacity:1;visibility:visible;pointer-events:auto}
.cloudie-scale-halo{position:absolute;inset:0;border-radius:50%;pointer-events:none;background:conic-gradient(from 25deg,#ffffff 0deg,#b8caff 60deg,#798bea 110deg,#e5d4ff 175deg,#9982d2 225deg,#c0e3e8 300deg,#ffffff);box-shadow:inset 0 0 3px 2px #ffffffb0,0 0 18px #a4bafa70,0 8px 24px #4d568332;animation:cloudie-breathe 4.8s ease-in-out infinite;mask:radial-gradient(circle,transparent 63%,#000 65%)}
.cloudie-scale-halo::after{content:"";position:absolute;inset:5px;border:1px solid #ffffffed;border-radius:50%;box-shadow:0 0 8px #fff,inset 0 0 6px #ffffffa0}
.cloudie-scale-core{position:absolute;inset:17px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border:1px solid #fffffff0;border-radius:50%;padding:10px;color:#2d3c62;background:radial-gradient(ellipse at 30% 12%,#ffffffed,transparent 64%),linear-gradient(150deg,#edf3ffed,#e7e2f4eb);backdrop-filter:blur(24px) saturate(1.15);box-shadow:inset 0 2px 4px #fff,inset 0 -3px 12px #9eacd136,0 3px 14px #5367931c;cursor:ns-resize;transition:box-shadow 180ms ease}
.cloudie-scale-label{font:600 14px/20px "Segoe UI","Microsoft YaHei UI",sans-serif;letter-spacing:1px;color:#425278}
.cloudie-scale-value{font:600 38px/44px "Segoe UI",sans-serif;font-variant-numeric:tabular-nums;letter-spacing:-1.6px;color:#4658a5}
.cloudie-scale-value span{font-size:14px;letter-spacing:0;margin-left:3px}
.cloudie-scale-hint{font:500 11px/17px "Segoe UI","Microsoft YaHei UI",sans-serif;color:#4f6080}
.cloudie-scale-status{font:500 10px/15px "Segoe UI","Microsoft YaHei UI",sans-serif;color:#65758d}
.cloudie-wheel-center.native-hover .cloudie-scale-core,.cloudie-wheel-center:hover .cloudie-scale-core{box-shadow:inset 0 2px 4px #fff,inset 0 -3px 12px #9eacd136,0 0 18px #9cace768}
.cloudie-wheel-center.scale-ready .cloudie-scale-status{color:#337f83}
.cloudie-wheel-center.scale-pulse .cloudie-scale-halo{filter:brightness(1.22);box-shadow:0 0 25px #92acffb0}
.cloudie-scale-core:focus-visible{outline:2px solid #5368c8;outline-offset:4px}
.cloudie-wheel-center:not(.scale-ready) .cloudie-scale-value{color:#7180a0}
@keyframes cloudie-breathe{0%,100%{opacity:.72;transform:scale(.985)}50%{opacity:1;transform:scale(1.015)}}
@media(prefers-reduced-motion:reduce){.cloudie-scale-halo{animation:none}.cloudie-scale-core,.cloudie-wheel-center{transition:none}}
@media(prefers-contrast:more){.cloudie-scale-core{background:#f4f6ff;backdrop-filter:none}.cloudie-scale-label,.cloudie-scale-value,.cloudie-scale-hint,.cloudie-scale-status{color:#26334c}}

/* Shared pointer, focus and native hit-test highlight. */
.cloudie-wheel-sector.active{fill:#5368c8;stroke:#b6c8ff;filter:drop-shadow(0 2px 5px #4559b84d)}
.cloudie-wheel-tool.active,.cloudie-wheel-tool.active .cloudie-wheel-icon{color:#fff}
.cloudie-wheel-tool:not(.active){color:#3c4d71}
.cloudie-wheel-tool:not(.active) .cloudie-wheel-icon{color:#657abe}
.cloudie-wheel-tool.active span{text-shadow:none}
.cloudie-wheel-tool.active:focus-visible{outline-color:#fff}