:root{color-scheme:dark;--eco-void: #04060a;--eco-void-soft: #070b11;--eco-ink: #eef2f6;--eco-ink-soft: rgba(238, 242, 246, .66);--eco-ink-faint: rgba(238, 242, 246, .34);--eco-ink-ghost: rgba(238, 242, 246, .2);--eco-line: rgba(238, 242, 246, .1);--eco-line-strong: rgba(238, 242, 246, .18);--eco-accent: #7fd4c1;--eco-accent-dim: rgba(127, 212, 193, .16);--eco-warn: #d8b48a;--eco-danger: #dd8f7c;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Noto Sans CJK SC", "Source Han Sans SC", "Microsoft YaHei", sans-serif;--font-mono: ui-monospace, "SFMono-Regular", "Cascadia Mono", "Roboto Mono", Consolas, monospace;--radius-pill: 999px;--radius-md: 13px;--dur-fast: .14s;--dur-base: .26s;--ease-out: cubic-bezier(.22, .61, .36, 1);--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px);--dock-gutter: clamp(14px, 3.2vw, 34px)}*,*:before,*:after{box-sizing:border-box}html{height:100%;background:var(--eco-void);-webkit-text-size-adjust:100%}body{height:100%;margin:0;overflow:hidden;color:var(--eco-ink);font-family:var(--font-sans);background:var(--eco-void);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior:none}#root{height:100%}button,input{font:inherit}button{color:inherit}::selection{color:var(--eco-void);background:var(--eco-accent)}.eco-shell{position:relative;width:100%;height:100dvh;min-height:100dvh;overflow:hidden;isolation:isolate}.eco-canvas{position:absolute;top:0;right:0;bottom:0;left:0;display:block;width:100%;height:100%;touch-action:manipulation}.eco-topbar{position:absolute;top:0;right:0;left:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:calc(13px + var(--safe-top)) calc(var(--dock-gutter) + var(--safe-right)) 0 calc(var(--dock-gutter) + var(--safe-left));pointer-events:none}.eco-brand{display:flex;align-items:baseline;gap:10px;min-width:0}.eco-brand-name{color:var(--eco-ink-soft);font-family:var(--font-mono);font-size:9.5px;letter-spacing:.24em;white-space:nowrap;text-transform:uppercase}.eco-brand-sub{overflow:hidden;color:var(--eco-ink-ghost);font-size:10px;letter-spacing:.08em;text-overflow:ellipsis;white-space:nowrap}.eco-state{display:inline-flex;flex:0 0 auto;align-items:center;gap:7px;color:var(--eco-ink-ghost);font-family:var(--font-mono);font-size:9.5px;letter-spacing:.12em;white-space:nowrap}.eco-state-dot{width:5px;height:5px;border-radius:50%;background:var(--eco-ink-ghost);transition:background var(--dur-base) var(--ease-out)}.eco-state-dot.is-live{background:var(--eco-accent);box-shadow:0 0 9px #7fd4c1d9;animation:eco-live 2.4s ease-in-out infinite}.eco-state-dot.is-paused{background:var(--eco-warn)}.eco-state-dot.is-asleep{background:#eef2f647}.eco-state-dot.is-error{background:var(--eco-danger);box-shadow:0 0 9px #dd8f7cb3}.eco-note{position:absolute;top:50%;left:50%;z-index:2;width:min(78vw,430px);text-align:center;pointer-events:none;transform:translate(-50%,-50%);animation:eco-note-in .42s var(--ease-out) both}.eco-note-kicker{margin:0 0 10px;color:var(--eco-ink-ghost);font-family:var(--font-mono);font-size:9px;letter-spacing:.32em;text-transform:uppercase}.eco-note-title{margin:0;color:var(--eco-ink-soft);font-size:clamp(15px,2.1vw,19px);font-weight:500;letter-spacing:-.01em}.eco-note-body{margin:9px 0 0;color:var(--eco-ink-ghost);font-size:12px;line-height:1.75}.eco-note.is-error .eco-note-title{color:#dd8f7ceb}.eco-dock{position:absolute;right:0;bottom:0;left:0;z-index:2;display:flex;flex-direction:column;gap:10px}.eco-dock>*{pointer-events:auto}.eco-hint{padding:0 var(--dock-gutter);color:var(--eco-ink-ghost);font-size:10.5px;line-height:1.6;text-align:center}.eco-hint.is-warn{color:#d8b48ad9}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}@keyframes eco-live{0%,to{opacity:.5;transform:scale(.88)}50%{opacity:1;transform:scale(1.16)}}@keyframes eco-note-in{0%{opacity:0;transform:translate(-50%,calc(-50% + 6px))}to{opacity:1;transform:translate(-50%,-50%)}}@media(max-width:640px){.eco-brand-sub{display:none}.eco-note{width:min(84vw,380px)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.eco-transport{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 var(--dock-gutter);padding:8px 10px 8px 8px;border:1px solid var(--eco-line);border-radius:var(--radius-pill);background:#080c128c;backdrop-filter:blur(18px) saturate(1.1);-webkit-backdrop-filter:blur(18px) saturate(1.1)}.eco-file-input{display:none}.eco-button{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;gap:7px;min-height:34px;padding:0 14px;color:var(--eco-ink-soft);font-size:11.5px;letter-spacing:.02em;white-space:nowrap;cursor:pointer;border:1px solid var(--eco-line);border-radius:var(--radius-pill);background:#eef2f60a;transition:color var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out),background var(--dur-fast) var(--ease-out)}.eco-button:hover:not(:disabled){color:var(--eco-ink);border-color:var(--eco-line-strong);background:#eef2f613}.eco-button:focus-visible{outline:2px solid rgba(127,212,193,.75);outline-offset:2px}.eco-button:disabled{color:var(--eco-ink-ghost);cursor:not-allowed;opacity:.55}.eco-button--play{width:40px;min-height:40px;padding:0;border-color:transparent;border-radius:50%;color:var(--eco-void);background:#eef2f6db}.eco-button--play:hover:not(:disabled){color:var(--eco-void);background:#fff}.eco-button--play.is-playing{color:var(--eco-ink);border-color:var(--eco-line-strong);background:#eef2f61a}.eco-button--play.is-playing:hover:not(:disabled){color:var(--eco-ink);background:#eef2f629}.eco-button svg{width:13px;height:13px}.eco-button--play svg{width:15px;height:15px}.eco-track{display:flex;flex:1 1 140px;flex-direction:column;gap:2px;min-width:0;padding-left:2px}.eco-track-name{overflow:hidden;color:var(--eco-ink-soft);font-size:11.5px;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}.eco-track-name.is-empty{color:var(--eco-ink-ghost)}.eco-track-meta{color:var(--eco-ink-ghost);font-family:var(--font-mono);font-size:9px;letter-spacing:.08em;font-variant-numeric:tabular-nums}.eco-time{flex:0 0 auto;padding-right:4px;color:var(--eco-ink-faint);font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;font-variant-numeric:tabular-nums}.eco-spinner{animation:eco-spin .9s linear infinite}.eco-archive{display:inline-flex;align-items:center;align-self:center;gap:7px;min-height:26px;padding:0 12px;color:var(--eco-ink-faint);font-size:10.5px;letter-spacing:.06em;cursor:pointer;border:1px solid var(--eco-line);border-radius:var(--radius-pill);background:#080c1273;transition:color var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out)}.eco-archive:hover{color:var(--eco-ink-soft);border-color:var(--eco-line-strong)}.eco-archive:focus-visible{outline:2px solid rgba(127,212,193,.75);outline-offset:2px}.eco-archive-seed{width:5px;height:5px;border-radius:50%;background:var(--eco-accent);box-shadow:0 0 8px #7fd4c199}.eco-reseed{position:absolute;right:calc(var(--dock-gutter) + var(--safe-right));bottom:calc(100% + 10px);display:grid;place-items:center;width:30px;height:30px;padding:0;color:var(--eco-ink-soft);cursor:pointer;border:1px solid var(--eco-line);border-radius:50%;background:#080c1259;opacity:.35;transition:opacity var(--dur-fast) var(--ease-out),color var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out)}.eco-reseed:hover{opacity:.6;border-color:var(--eco-line-strong)}.eco-reseed:focus-visible{opacity:.85;outline:2px solid rgba(127,212,193,.7);outline-offset:2px}.eco-reseed svg{width:14px;height:14px}@media(max-width:520px){.eco-reseed{right:calc(10px + var(--safe-right));bottom:calc(100% + 6px);width:28px;height:28px}}@keyframes eco-spin{to{transform:rotate(360deg)}}@media(max-width:520px){.eco-transport{gap:8px;padding:7px 8px}.eco-button{min-height:32px;padding:0 11px;font-size:11px}.eco-button--play{width:36px;min-height:36px;padding:0}.eco-button__label{display:none}.eco-track{flex-basis:auto}}.eco-disclaimer{padding:0 clamp(16px,4vw,40px) calc(10px + env(safe-area-inset-bottom,0px));color:var(--eco-ink-faint);font-size:10.5px;line-height:1.65;letter-spacing:.01em;max-width:980px;margin:0 auto;text-align:center;-webkit-user-select:text;user-select:text}.eco-disclaimer strong{display:block;margin-bottom:2px;font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--eco-ink-soft);opacity:.7}.eco-disclaimer p{margin:0}.eco-disclaimer a{color:inherit}@media(max-width:640px){.eco-disclaimer{font-size:9.5px;line-height:1.6;padding-bottom:calc(8px + env(safe-area-inset-bottom,0px))}}@media(max-height:560px){.eco-disclaimer{font-size:9px}}
