.buoy-root{background:linear-gradient(180deg,var(--abyss) 0%,var(--deep) 100%)}.buoy-bg{background:radial-gradient(80rem 26rem at 50% -12rem,rgba(65,216,211,.14),transparent 70%),radial-gradient(50rem 32rem at 92% 8%,rgba(0,101,171,.3),transparent 60%)}.buoy-dot{display:inline-block;width:.6rem;height:.6rem;border-radius:9999px}.buoy-dot--live{background:#22c55e;box-shadow:0 0 #22c55eb3;animation:buoyPulse 1.8s infinite}.buoy-dot--connecting{background:var(--signal);animation:buoyBlink 1s infinite}.buoy-dot--demo{background:var(--signal);box-shadow:0 0 #f1b022b3;animation:buoyPulse 1.8s infinite}.buoy-dot--error{background:#ef4444}.buoy-dot--buoy{background:var(--signal);animation:buoyPulseSignal 1.8s infinite}@keyframes buoyPulse{0%{box-shadow:0 0 #22c55e99}70%{box-shadow:0 0 0 .7rem #22c55e00}to{box-shadow:0 0 #22c55e00}}@keyframes buoyPulseSignal{0%{box-shadow:0 0 #f1b02299}70%{box-shadow:0 0 0 .7rem #f1b02200}to{box-shadow:0 0 #f1b02200}}@keyframes buoyBlink{0%,to{opacity:1}50%{opacity:.3}}.buoy-badge{display:inline-flex;align-items:center;gap:.4rem;border-radius:9999px;padding:.35rem .8rem;font-weight:600;font-size:.8rem;background:#f1b02233;color:#fff;box-shadow:inset 0 0 0 1px #fff3}.buoy-badge--live{background:#22c55e38}.buoy-badge--demo{background:#f1b02238}.buoy-badge--error{background:#ef444440}.buoy-card{position:relative;border-radius:1rem;padding:1.25rem 1.4rem;background:#ffffff0d;box-shadow:inset 0 0 0 1px #ffffff1a,0 10px 30px -12px #00000080;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);overflow:hidden;transition:transform .3s var(--ease-descent),box-shadow .3s var(--ease-descent)}.buoy-card:before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(24rem 12rem at 100% 0%,rgba(var(--glow),.16),transparent 60%);pointer-events:none}.buoy-card:hover{transform:translateY(-4px);box-shadow:inset 0 0 0 1px rgba(var(--glow),.45),0 18px 40px -14px #0009}.buoy-card-head{display:flex;align-items:center;gap:.7rem;font-family:IBM Plex Mono,ui-monospace,monospace;font-size:.68rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:#eef3f2a6}.buoy-card-head i{display:grid;place-items:center;width:2.1rem;height:2.1rem;border-radius:.6rem;font-size:.95rem;background:rgba(var(--glow),.14);color:rgb(var(--glow));box-shadow:inset 0 0 0 1px rgba(var(--glow),.4)}.buoy-value{margin:.9rem 0 .25rem;font-family:IBM Plex Mono,ui-monospace,monospace;font-size:2.2rem;line-height:1;font-weight:600;color:#fff}.buoy-value small{margin-left:.35rem;font-size:.95rem;font-weight:500;color:#eef3f28c}.buoy-sub{font-size:.8rem;color:#eef3f299}.buoy-card:after{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,rgba(var(--glow),.85),rgba(var(--glow),0) 72%);pointer-events:none}.buoy-viz{position:relative;margin-top:.9rem;height:2rem}.buoy-viz--wave svg{width:100%;height:100%;overflow:visible;transform:scaleY(var(--amp,.6));transform-origin:center}.buoy-viz--wave path{stroke:#26bab6;stroke-width:2;vector-effect:non-scaling-stroke}.buoy-wave-front{animation:buoyWave 5s linear infinite}.buoy-wave-back{stroke-opacity:.35;animation:buoyWave 8s linear infinite}@keyframes buoyWave{to{transform:translate(30px)}}.buoy-viz--period{height:1.2rem;display:flex;align-items:center}.buoy-viz--period:before{content:"";width:100%;height:1px;background:#ffffff2e}.buoy-period-dot{position:absolute;top:50%;left:0;width:.55rem;height:.55rem;border-radius:9999px;transform:translate(-50%,-50%);background:#78c7ff;box-shadow:0 0 10px #78c7ffe6;animation:buoyPeriodSweep var(--period, 10s) linear infinite}@keyframes buoyPeriodSweep{0%{left:0;opacity:0}8%{opacity:1}92%{opacity:1}to{left:100%;opacity:0}}.buoy-viz--scale{height:1.2rem;display:flex;align-items:center}.buoy-viz--scale:before{content:"";width:100%;height:4px;border-radius:9999px;opacity:.85;background:linear-gradient(90deg,#0065abbf,#41d8d3d9,#f1b022e6)}.buoy-viz--scale-cool:before{background:linear-gradient(90deg,#002845e6,#0065abd9,#78c7ffe6)}.buoy-viz--scale-salt:before{background:linear-gradient(90deg,#17706dd9,#26bab6e6,#d0f5f4f2)}.buoy-scale-marker{position:absolute;top:50%;left:calc(var(--pos,50) * 1%);width:.85rem;height:.85rem;border-radius:9999px;transform:translate(-50%,-50%);background:#fff;box-shadow:0 0 0 3px #ffffff38,0 0 14px rgba(var(--glow),.95);transition:left .8s var(--ease-descent)}.buoy-viz--bubbles{overflow:hidden}.buoy-viz--bubbles span{position:absolute;bottom:-.6rem;width:.42rem;height:.42rem;border-radius:9999px;border:1px solid rgba(156,201,122,.85);background:#9cc97a29;animation:buoyBubble 3.4s ease-in infinite}.buoy-viz--bubbles span:nth-child(1){left:8%}.buoy-viz--bubbles span:nth-child(2){left:28%;width:.26rem;height:.26rem;animation-delay:1.2s;animation-duration:2.7s}.buoy-viz--bubbles span:nth-child(3){left:50%;animation-delay:.6s}.buoy-viz--bubbles span:nth-child(4){left:71%;width:.32rem;height:.32rem;animation-delay:1.9s;animation-duration:3s}.buoy-viz--bubbles span:nth-child(5){left:89%;animation-delay:.3s;animation-duration:3.9s}@keyframes buoyBubble{0%{transform:translateY(0) translate(0);opacity:0}12%{opacity:1}55%{transform:translateY(-1.2rem) translate(2px)}to{transform:translateY(-2.5rem) translate(-2px);opacity:0}}.buoy-viz--eq{display:flex;align-items:flex-end;gap:4px}.buoy-viz--eq span{flex:1;max-width:12px;border-radius:2px 2px 0 0;transform-origin:bottom;height:calc(2rem * var(--h,.5) * var(--level,.65));background:linear-gradient(180deg,#afd394f2,#afd39433);animation:buoyEq 1s ease-in-out infinite alternate}.buoy-viz--eq span:nth-child(1){--h:.35;animation-delay:.05s}.buoy-viz--eq span:nth-child(2){--h:.6;animation-delay:.35s}.buoy-viz--eq span:nth-child(3){--h:.45;animation-delay:.6s}.buoy-viz--eq span:nth-child(4){--h:.85;animation-delay:.15s}.buoy-viz--eq span:nth-child(5){--h:.55;animation-delay:.5s}.buoy-viz--eq span:nth-child(6){--h:1;animation-delay:0s}.buoy-viz--eq span:nth-child(7){--h:.7;animation-delay:.42s}.buoy-viz--eq span:nth-child(8){--h:.9;animation-delay:.22s}.buoy-viz--eq span:nth-child(9){--h:.5;animation-delay:.55s}.buoy-viz--eq span:nth-child(10){--h:.75;animation-delay:.3s}.buoy-viz--eq span:nth-child(11){--h:.4;animation-delay:.12s}.buoy-viz--eq span:nth-child(12){--h:.65;animation-delay:.48s}@keyframes buoyEq{0%{transform:scaleY(.45)}to{transform:scaleY(1)}}@media (prefers-reduced-motion: reduce){.buoy-wave-front,.buoy-wave-back,.buoy-period-dot,.buoy-viz--bubbles span,.buoy-viz--eq span{animation:none!important}.buoy-period-dot{left:50%;opacity:1}.buoy-viz--eq span{transform:scaleY(.8)}}.buoy-compass{position:relative;width:5.5rem;height:5.5rem;border-radius:9999px;flex:none;background:radial-gradient(circle at 50% 35%,#ffffff0f,#0000004d 70%);box-shadow:inset 0 0 0 2px #41d8d380,0 8px 22px -10px #0009}.buoy-compass:before{content:"";position:absolute;inset:5px;border-radius:9999px;background:repeating-conic-gradient(from -1deg,rgba(255,255,255,.4) 0deg 2deg,transparent 2deg 30deg);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 5px),#000 calc(100% - 5px));mask:radial-gradient(farthest-side,transparent calc(100% - 5px),#000 calc(100% - 5px))}.buoy-compass:after{content:"";position:absolute;left:50%;top:50%;width:4px;height:4px;transform:translate(-50%,-50%);border-radius:9999px;background:#ffffff80}.buoy-compass--wind{box-shadow:inset 0 0 0 2px #f1b02299,0 8px 22px -10px #0009}.buoy-compass-pt{position:absolute;z-index:1;font-family:IBM Plex Mono,ui-monospace,monospace;font-size:.55rem;font-weight:600;color:#ffffff73}.buoy-compass-pt--n{top:.45rem;left:50%;transform:translate(-50%);color:var(--biolume)}.buoy-compass--wind .buoy-compass-pt--n{color:var(--signal)}.buoy-compass-pt--s{bottom:.45rem;left:50%;transform:translate(-50%)}.buoy-compass-pt--e{right:.5rem;top:50%;transform:translateY(-50%)}.buoy-compass-pt--w{left:.5rem;top:50%;transform:translateY(-50%)}.buoy-compass-arrow{position:absolute;inset:0;display:grid;place-items:center;transition:transform .8s var(--ease-descent);transform:rotate(0)}.buoy-compass-arrow i{font-size:1.4rem;color:var(--biolume);transform:rotate(-45deg);filter:drop-shadow(0 0 6px rgba(65,216,211,.7))}.buoy-compass--wind .buoy-compass-arrow i{color:var(--signal);filter:drop-shadow(0 0 6px rgba(241,176,34,.7))}.rig-figure{position:relative;margin:2.5rem auto 0;max-width:69rem}.rig-figure:before{content:"";position:absolute;inset:-8% -4% -14%;background:radial-gradient(60% 55% at 50% 42%,rgba(65,216,211,.3),transparent 70%),radial-gradient(45% 50% at 78% 25%,rgba(241,176,34,.16),transparent 72%);filter:blur(38px);opacity:.85;pointer-events:none;z-index:0}.rig-frame{position:relative;z-index:1;overflow-x:auto;overscroll-behavior-x:contain;border-radius:1.25rem;box-shadow:inset 0 0 0 1px #ffffff24,0 34px 70px -28px #000000d9}.rig-img{display:block;width:100%;min-width:40rem;height:auto}.rig-hint{margin-top:.75rem;text-align:center;font-family:IBM Plex Mono,ui-monospace,monospace;font-size:.68rem;letter-spacing:.1em;color:#eef3f273}@media (min-width: 680px){.rig-img{min-width:0}.rig-hint{display:none}}#buoy-map{z-index:0}.leaflet-container{font:inherit;background:#0a2a45}#buoy-map .leaflet-top.leaflet-left{left:auto;right:10px}#buoy-map .leaflet-control-zoom{border:none;box-shadow:0 8px 24px -10px #0009}#buoy-map .leaflet-control-zoom a{background:#05131ed9;color:var(--mist);border:1px solid rgba(255,255,255,.15);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}#buoy-map .leaflet-control-zoom a:hover{background:#05131ef2;color:var(--biolume)}.buoy-marker{width:1.4rem;height:1.4rem;border-radius:9999px;background:var(--signal);box-shadow:0 0 0 4px #f1b02259;position:relative}.buoy-marker:after{content:"";position:absolute;inset:-4px;border-radius:9999px;border:2px solid var(--signal);animation:buoyRing 2s ease-out infinite}@keyframes buoyRing{0%{transform:scale(.6);opacity:.9}to{transform:scale(2.4);opacity:0}}.buoy-marker--cocos{background:#22c55e;box-shadow:0 0 0 4px #22c55e4d}.buoy-marker--cocos:after{display:none}
