*{box-sizing:border-box;margin:0;padding:0}body,body[data-variant="vault"]{--ground:#0a0b0e;--ground-solid:#0a0b0e;--fg:#fff;--font:'Space Grotesk',system-ui,sans-serif;--dock-bg:rgba(20,22,29,0.75);--dock-blur:blur(20px);--dock-border:1px solid rgba(255,255,255,0.12);--dock-radius:24px;--dock-shadow:0 20px 50px rgba(0,0,0,0.5);--item-radius:14px;--item-border:1px solid rgba(255,255,255,0.1);--item-fg:#fff;--item-shadow:none;--item-bg-blue:linear-gradient(135deg,#3b82f6,#1d4ed8);--item-bg-purple:linear-gradient(135deg,#a855f7,#6d28d9);--item-bg-emerald:linear-gradient(135deg,#10b981,#047857);--item-bg-amber:linear-gradient(135deg,#f59e0b,#b45309);--item-bg-rose:linear-gradient(135deg,#f43f5e,#be123c);--item-bg-lime:linear-gradient(135deg,#84cc16,#4d7c0f);--tooltip-bg:rgba(10,11,14,0.95);--tooltip-fg:#fff;--tooltip-border:1px solid #262a38;--tooltip-radius:6px;--tooltip-shadow:none}body[data-variant="glass"]{--ground:linear-gradient(135deg,#f6d5e6 0%,#c9d4ff 45%,#bfeef0 100%);--ground-solid:#d6d4f3;--fg:#1e1b3a;--font:'Space Grotesk',system-ui,sans-serif;--dock-bg:rgba(255,255,255,0.32);--dock-blur:blur(24px) saturate(160%);--dock-border:1px solid rgba(255,255,255,0.7);--dock-radius:28px;--dock-shadow:0 24px 60px rgba(60,50,120,0.18),inset 0 1px 0 rgba(255,255,255,0.8);--item-radius:16px;--item-border:1px solid rgba(255,255,255,0.65);--item-fg:#fff;--item-shadow:0 6px 18px rgba(60,50,120,0.16);--item-bg-blue:rgba(59,130,246,0.6);--item-bg-purple:rgba(139,92,246,0.6);--item-bg-emerald:rgba(16,185,129,0.6);--item-bg-amber:rgba(245,158,11,0.6);--item-bg-rose:rgba(244,63,94,0.6);--item-bg-lime:rgba(101,163,13,0.6);--tooltip-bg:rgba(255,255,255,0.75);--tooltip-fg:#1e1b3a;--tooltip-border:1px solid rgba(255,255,255,0.9);--tooltip-radius:10px;--tooltip-shadow:0 8px 24px rgba(60,50,120,0.18)}body[data-variant="brutal"]{--ground:#f2efe6;--ground-solid:#f2efe6;--fg:#111;--font:'Space Grotesk',system-ui,sans-serif;--dock-bg:#fff;--dock-blur:none;--dock-border:3px solid #111;--dock-radius:0;--dock-shadow:8px 8px 0 #111;--item-radius:0;--item-border:3px solid #111;--item-fg:#111;--item-shadow:3px 3px 0 #111;--item-bg-blue:#5ea3ff;--item-bg-purple:#c79bff;--item-bg-emerald:#4ade80;--item-bg-amber:#ffd23f;--item-bg-rose:#ff6b8a;--item-bg-lime:#c8ff00;--tooltip-bg:#111;--tooltip-fg:#fff;--tooltip-border:3px solid #111;--tooltip-radius:0;--tooltip-shadow:3px 3px 0 #c8ff00}body{background:var(--ground);color:var(--fg);font-family:var(--font);min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden}.dock-container{display:flex;align-items:flex-end;gap:12px;background:var(--dock-bg);backdrop-filter:var(--dock-blur);-webkit-backdrop-filter:var(--dock-blur);border:var(--dock-border);border-radius:var(--dock-radius);padding:10px 14px;box-shadow:var(--dock-shadow)}.dock-item{position:relative;width:48px;height:48px;border-radius:var(--item-radius);background:var(--item-bg,linear-gradient(135deg,#2a2e3d,#181b24));border:var(--item-border);box-shadow:var(--item-shadow);display:flex;align-items:center;justify-content:center;color:var(--item-fg);cursor:pointer;outline:none;transform-origin:bottom center;will-change:transform}.dock-item:focus-visible{outline:2px solid var(--fg);outline-offset:3px}.dock-item svg{width:50%;height:50%;pointer-events:none}.dock-item[data-color="blue"]{--item-bg:var(--item-bg-blue)}.dock-item[data-color="purple"]{--item-bg:var(--item-bg-purple)}.dock-item[data-color="emerald"]{--item-bg:var(--item-bg-emerald)}.dock-item[data-color="amber"]{--item-bg:var(--item-bg-amber)}.dock-item[data-color="rose"]{--item-bg:var(--item-bg-rose)}.dock-item[data-color="lime"]{--item-bg:var(--item-bg-lime)}.dock-tooltip{position:absolute;top:-38px;left:50%;transform:translateX(-50%) translateY(6px);background:var(--tooltip-bg);border:var(--tooltip-border);color:var(--tooltip-fg);box-shadow:var(--tooltip-shadow);padding:4px 10px;border-radius:var(--tooltip-radius);font-size:0.75rem;font-weight:500;white-space:nowrap;pointer-events:none;opacity:0;visibility:hidden;transition:all 0.2s cubic-bezier(0.16,1,0.3,1)}.dock-item:hover .dock-tooltip{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}